CODEWITHSUNDEEP
javascriptangularjs
Colton Williams
Colton Williams

Reputation: 294

Angular Resolve: Variable is not defined

I am working with Angular Routes for the first time and I recently posed a question regarding a refresh losing some data, the answer I received was to use resolve. It seems to be the solution I was looking for however I cannot get it to work properly.

.config(['$routeProvider', function($routeProvider) {
           //determines redirects go via shortcuts, clicking on the management icon on the main page sends the routeProvider /MG which it then uses to pull the relevant HTML file
           $routeProvider
               .when('/MG', {
                   controller: 'teammateController',
                   templateUrl: './assets/departments/department.html',
                   resolve: {
                       activeDepartment: function() {
                           return 'Management'
                       }
                   }
               })
               .when('/PO', {
                   controller: 'teammateController',
                   templateUrl: './assets/departments/department.html',
                   resolve: {
                       activeDepartment: function() {
                           return 'Programs Office'
                       }
                   }
               })
               .when('/SM', {
                   controller: 'teammateController',
                   templateUrl: './assets/departments/department.html',
                   resolve: {
                       activeDepartment: function() {
                           return 'Sales And Marketing'
                       }
                   }
               })
               .when('/', {
                   controller: 'teammateController',
                   templateUrl: 'home.html',
                   resolve: {
                       activeDepartment: function() {
                           console.log("working");
                           return 'home';
                       }
                   }
               })
               .otherwise({
                   controller: 'teammateController',
                   templateUrl: 'home.html',
                   resolve: {
                       activeDepartment: function() {
                           console.log("working");
                           return 'home';
                       }
                   }
               })
       }]);

   app.controller('teammateController', function teammateController($scope, $http, $rootScope, $timeout, Idle, $location) {
       $scope.deptName = activeDepartment();
     });

I receive "ReferenceError: activeDepartment is not defined". The console log works and I see "working", so I know resolve is being run but, then the error message appears. I've tried everything I can think of and I cannot for the life of me see where I am going wrong. Any help would be appreciated.

Upvotes: 0

Views: 1290

Answers (2)

Amy Blankenship
Amy Blankenship

Reputation: 6961

app.controller('teammateController', function teammateController($scope, $http, $rootScope, $timeout, Idle, $location) {
       $scope.deptName = activeDepartment();
     });

should be

app.controller('teammateController', function teammateController($scope, $http, $rootScope, $timeout, Idle, $location, activeDepartment) {
       $scope.deptName = activeDepartment;
     });

BTW, the syntax you're using is not going to work if you want to minify your code.

Upvotes: 1

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

The resolved properties are injected into your controller, so try this:

app.controller('teammateController', function teammateController($scope, $http, $rootScope, $timeout, Idle, $location, activeDepartment) {
   $scope.deptName = activeDepartment;
 });

Notice the additional argument at the end of your controller.

Upvotes: 2

Related Questions