I have a problem injecting resolve parameters from the routing into the controller. I'm setting the resolve value to an object {name: 'Banner', slug: 'banner'}
, but I get an error.
App.js
var app = angular.module('CMS', ['fields', 'ngRoute']);
app.controller('ModuleController', ['$http', 'properties',
function($http, properties) {
var module = this;
module.properties = properties;
if (module.properties.slug.length) {
$http.get(module.properties.slug + '.php').success(function(data) {
module.list = data;
});
}
}
]);
app.controller('HomeController', function() {});
app.config(function($routeProvider) {
$routeProvider
// route for the banner page
.when('/banner1', {
templateUrl: 'banner1.php',
controller: 'ModuleController',
resolve: {
properties: function() {
return { name: 'Banner', slug: 'banner' };
}
}
})
.when('/home', {
templateUrl: 'home.php',
controller: 'HomeController'
})
.otherwise({
redirectTo: '/home'
});
});
Error:
Error: [$injector:unpr] http://errors.angularjs.org/1.3.14/$injector/unpr?p0=propertiesProvider%20%3C-%20properties%20%3C-%20ModuleController
at Error (native)
at http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:6:417
at http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:38:7
at Object.d [as get] (http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:36:13)
at http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:38:81
at d (http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:36:13)
at Object.e [as invoke] (http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:36:283)
at $get.w.instance (http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:75:451)
at http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:58:476
at s (http://modelo2.desenvolvimento.com/adm/js/angular/angular.min.js:7:408) <div ng-view="" class="ng-scope">
ngRoute
supports injection of resolved variables to the controller, which is useful for cross-cutting concerns of the app, like authentication or configuration of the app.
The downside is that the controller can only be instantiated with these parameters available to be injected, which means that either you instantiate your controller manually (with $controller
), which almost never the case, or with ngRoute
with resolve. What you cannot do with such a controller is instantiate it with ng-controller
or in any other location where the injected parameters are not available.
This error indicates that in addition to having defined the controller on the route, you also have the controller defined as ng-controller
in the template of the route. This second instantiation of the controller is what fails.