I have an angular app and I'm attempting to refresh the page. I've tried using $route.reload() as recommended in multiple posts, but I can't seem to get it to work (Chrome is showing me an error). Here's my controller:
var app = angular.module('StudentProgram', ['ngRoute', 'ui.bootstrap', 'jsonService']);
app.controller('mycontroller', function($route, RequirementsService, DegreesService, DegreeCategoriesService, DetailsService, ProgramsService, $scope, $modal, $log, $http) {
ProgramsService.getItems(function(data){
$scope.programs = data;
console.log(data);
});
$scope.addDegree = function(degree) {
var variablesToSend = {
"acad_program_type": degree.acad_program_type,
"program_title": degree.program_title,
}
}
$http.post('/api/studentacademicprogram/', variablesToSend).then(function(response){
console.log(response);
alert('post added');
$route.reload();
}, function(response){
console.log(response);
alert('post not added');
});
};
Here is the div where I am accessing the function:
<div ng-show="display.academicdegrees" class="col-lg-8 col-md-8 col-sm-8">
<div class="panel panel-warning list-group list-unstyled" data-spy="scroll" data-target="#panelcategory" data-offset="0" style="max-height:400px;overflow:auto;position:relative;">
<div class="panel-heading">
{% verbatim %}
<h3 class="panel-title">{{DegreeCategory}}</h3>
{% endverbatim %}
</div>
</div>
</div>
Where am I making the error? The page refreshes when I hit the refresh button, but it doesn't happen when I call the function.