[英]AngularJS Dependency injection in controller of routeProvider resolve
Injecting the return object of a resolve
which should be injected into the controller, but it's not. 注入
resolve
的返回对象,该对象应该注入控制器中,但不是。 I am using a promise so that the controller does not instanciate until the promise is resolved, since I am doing a HTTP POST using the $http
service. 我正在使用Promise,以便控制器不会实例化直到Promise被解决,因为我正在使用
$http
服务执行HTTP POST。
I am also doing some redirection depending on the response data by using $location.path
. 我还通过使用
$location.path
根据响应数据进行一些重定向。 The first route will redirect to the template1
route with the data it has obtained. 第一条路由将使用其获取的数据重定向到
template1
路由。
$routeProvider
.when("/auth/:id", amd.route(
{
controller: 'eventController',
controllerUrl: 'app/controllers/eventController',
resolve: {
returnedData: ['$http', '$location', '$route', '$q', function ($http, $location, $route, $q) {
var id = $route.current.params.id;
var defer = $q.defer();
$http({
method: 'POST',
url: 'http://domain/service/webapi',
data: { 'name': id }
}).then(function (response) {
var template = "/template".concat(response.data.displayLayout);
defer.resolve(response.data);
$location.path(template);
return defer.promise;
});
}]
}
}))
.when("/template1", amd.route(
{
templateUrl: 'views/templates/template1.html',
controller: 'eventController',
controllerUrl: 'app/controllers/eventController',
}));
app.controller('eventController', ['$scope', '$routeParams', '$timeout', 'returnedData',
function ($scope, $routeParams, $timeout, returnedData) {
// ...controller code here: $scope.returnedData = returnedData
});
I am getting the AngularJS error: 我收到AngularJS错误:
Error: $injector:unpr Unknown Provider
错误:$ injector:unpr未知提供程序
Any thoughts on this? 有什么想法吗?
In the AngularJS API page, about the routeProvider ( https://docs.angularjs.org/api/ngRoute/provider/ $routeProvider) 在AngularJS API页面中,关于routeProvider( https://docs.angularjs.org/api/ngRoute/provider/ $ routeProvider)
you can see: 您可以看到:
resolve - {Object.=} ... If any of these dependencies are promises, the router will wait for them all to be resolved or one to be rejected before the controller is instantiated
resolve-{Object。=} ...如果承诺中有任何依赖项,则路由器将在实例化控制器之前等待它们全部解决或拒绝所有依赖项
You should edit your code like below: 您应该像下面那样编辑代码:
var id = $route.current.params.id;
var defer = $q.defer();
$http({
method: 'POST',
url: 'http://domain/service/webapi',
data: { 'name': id }
}).then(function (response) {
var template = "/template".concat(response.data.displayLayout);
defer.resolve(response.data);
$location.path(template);
});
// return the promise outside `then` method, then angularjs will wait it `resolve`
return defer.promise;
And further more, Please notice this: 此外,请注意以下几点:
Be aware that ngRoute.$routeParams will still refer to the previous route within these resolve functions.
请注意,ngRoute。$ routeParams仍将引用这些解析函数中的上一条路由。 Use $route.current.params to access the new route parameters, instead.
使用$ route.current.params来访问新的路由参数。
Using Dependency Injection with ng-route , my solution: 将依赖注入与ng-route结合使用,我的解决方案是:
var myApp = angular.module("myApp", ["ngRoute", "localytics.directives"]);
myApp.config(['$routeProvider',function ($routeProvider) {
$routeProvider
.when("/", {
templateUrl: "//TimeLine.html",
controller: "MainCtrl"
})
.when("/AddOrEditOccasion", {
templateUrl: "/Html/GiftWhiz/AddOrEditOccasion.html",
controller: "AddOrEditOccasionCtrl"
})
.when("/OccasionStart", {
templateUrl: "/OccasionStart.html",
controller: "OccasionStartCtrl"
})
}]);
myApp.controller("MainCtrl", ['$scope', '$http', '$location', function ($scope, $http, $location) {
//your codes
}]);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.