$routeParams 在主控制器中为空 [英] $routeParams is empty in main controller
问题描述
我有这段布局html:
I have this piece of layout html:
<body ng-controller="MainController">
<div id="terminal"></div>
<div ng-view></div>
<!-- including scripts -->
</body>
现在显然，当我尝试在 MainController 中使用 $routeParams 时，它总是空的.需要注意的是 MainController 应该在所有可能的路由中生效；因此我没有在我的 app.js 中定义它.我的意思是，我不是在这里定义它:
Now apparently, when I try to use $routeParams in MainController, it's always empty. It's important to note that MainController is supposed to be in effect in every possible route; therefore I'm not defining it in my app.js. I mean, I'm not defining it here:
$routeProvider.when("/view1", {
templateUrl: "partials/partial1.html"
controller: "MyCtrl1"
})
$routeProvider.when("/view2", {
templateUrl: "partials/partial2.html"
controller: "MyCtrl2"
})
// I'm not defining MainController here!!
事实上，我认为我的问题和这个完全一样:https://groups.google.com/forum/#!topic/angular/ib2wHQozeNE
In fact, I think my problem is perfectly the same as this one: https://groups.google.com/forum/#!topic/angular/ib2wHQozeNE
然而，我仍然不明白如何在我的主控制器中获取路由参数...
However, I still don't get how to get route parameters in my main controller...
我的意思是我没有将我的 MainController 与任何特定路由相关联.它是定义的；它是所有其他控制器的父控制器.我想知道的是，当你访问像 /whatever 这样的 URL 时，它与像 /:whatever 这样的路由匹配，为什么只有子控制器能够访问路由参数，而主控制器不能?如何在主控制器中获取 :whatever 路由参数?
What I meant was that I'm not associating my MainController with any specific route. It's defined; and it's the parent controller of all other controllers. What I'm trying to know is that when you go to a URL like /whatever, which is matched by a route like /:whatever, why is it that only the sub-controller is able to access the route parameter, whereas the main controller is not? How do I get the :whatever route parameter in my main controller?
推荐答案
$routeParams 服务是异步填充的.这意味着它在控制器中首次使用时通常会显示为空.
The $routeParams service is populated asynchronously. This means it will typically appear empty when first used in a controller.
要在填充 $routeParams 时收到通知，请订阅 $scope 上的 $routeChangeSuccess 事件.(如果您在一个无权访问子 $scope 的组件中，例如服务或工厂，您可以注入并使用 $rootScope 代替.)
To be notified when $routeParams has been populated, subscribe to the $routeChangeSuccess event on the $scope. (If you're in a component that doesn't have access to a child $scope, e.g., a service or a factory, you can inject and use $rootScope instead.)
module.controller('FooCtrl', function($scope, $routeParams) {
$scope.$on('$routeChangeSuccess', function() {
// $routeParams should be populated here
});
);
路由使用的控制器或路由包含的模板内的控制器将可以立即访问完全填充的 $routeParams 因为 ng-view 等待$routeChangeSuccess 事件，然后再继续.(它必须等待，因为它需要路由信息来决定加载哪个模板/控制器.)
Controllers used by a route, or within a template included by a route, will have immediate access to the fully-populated $routeParams because ng-view waits for the $routeChangeSuccess event before continuing. (It has to wait, since it needs the route information in order to decide which template/controller to even load.)
如果您知道您的控制器将在 ng-view 内使用，您将不需要等待路由事件.如果你知道你的控制器不会，你会的.如果您不确定，则必须明确允许这两种可能性.订阅 $routeChangeSuccess 是不够的；如果 $routeParams 尚未填充，您只会看到该事件:
If you know your controller will be used inside of ng-view, you won't need to wait for the routing event. If you know your controller will not, you will. If you're not sure, you'll have to explicitly allow for both possibilities. Subscribing to $routeChangeSuccess will not be enough; you will only see the event if $routeParams wasn't already populated:
module.controller('FooCtrl', function($scope, $routeParams) {
// $routeParams will already be populated
// here if this controller is used within ng-view
$scope.$on('$routeChangeSuccess', function() {
// $routeParams will be populated here if
// this controller is used outside ng-view
});
);
这篇关于$routeParams 在主控制器中为空的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
