Angular UI路由器嵌套状态在子状态下parsing
在我正在处理的angular度应用程序中，我想要有一个抽象的父状态，它必须解决其所有子状态的某些依赖关系。 具体来说，我想要所有的状态需要一个经过身份validation的用户从一些authroot状态inheritance依赖。
我遇到的问题有父依赖不总是被重新解决。 理想情况下，我想让父状态检查用户是否仍然自动login到任何子状态。 在文档中 ，它说
子状态将从父状态inheritance已parsing的依赖关系，可以覆盖它们。
我发现如果从父类之外的状态input任何子状态，父类依赖关系只能被重新parsing，但是如果在父类之间移动，则不能。
在这个例子中，如果你在状态authroot.testA和authroot.testB之间移动，GetUser方法只被调用一次。 当你移动到other状态时，它会再次运行。
我能够将用户依赖关系放在每个子状态上，以确保每次进入这些状态时都会调用该方法，但是这似乎是失败了inheritance依赖关系的目的。
我不正确地理解文档吗？ 有没有办法强制父母国家重新解决其依赖关系，即使当兄弟姐妹之间的状态改变？
的jsfiddle
<!doctype html> <html> <head> <script src="ajax/libs/angular.js/1.2.1/angular.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.0/angular-ui-router.min.js"></script> <script> (function(ng) { var app = ng.module("Test", ["ui.router"]); app.config(["$stateProvider", "$urlRouterProvider", function(sp, urp) { urp.otherwise("/testA"); sp.state("authroot", { abstract: true, url: "", template: "<div ui-view></div>", resolve: {User: ["UserService", function(UserService) { console.log("Resolving dependency..."); return UserService.GetUser(); }]} }); sp.state("authroot.testA", { url: "/testA", template: "<h1>Test A {{User|json}}</h1>", controller: "TestCtrl" }); sp.state("authroot.testB", { url: "/testB", template: "<h1>Test B {{User|json}}</h1>", controller: "TestCtrl" }); sp.state("other", { url: "/other", template: "<h1>Other</h1>", }); }]); app.controller("TestCtrl", ["$scope", "User", function($scope, User) {$scope.User = User;}]); app.factory("UserService", ["$q", "$timeout", function($q, $timeout) { function GetUser() { console.log("Getting User information from server..."); var d = $q.defer(); $timeout(function(){ console.log("Got User info."); d.resolve({UserName:"JohnDoe1", OtherData: "asdf"}); }, 500); return d.promise; }; return { GetUser: GetUser }; }]); })(window.angular); </script> </head> <body ng-app="Test"> <a ui-sref="authroot.testA">Goto A</a> <a ui-sref="authroot.testB">Goto B</a> <a ui-sref="other">Goto Other</a> <div ui-view>Loading...</div> </body> </html>
我发现ui-router非常的方式就是你刚才描述的行为。
让我们来考虑一些实体，例如Contact。 所以最好有一个右侧显示我们的联系人列表，左侧部分的细节。 请检查与AngularJS使用ui路由器的基本知识，以便快速了解有关布局。 引用：
ui路由器完全包含路由系统的状态机性质。 它允许你定义状态，并将你的应用程序转换到这些状态。 真正的胜利是它可以让你去耦合嵌套状态，并且以一种优雅的方式做一些非常复杂的布局。
你需要以不同的方式思考你的路由，但是一旦你开始采用基于状态的方法，我想你会喜欢它。
好的，为什么呢？
因为我们可以有一个状态Contact代表一个列表。 从细节的angular度说一个固定的清单 。 （现在跳过列表分页过滤）我们可以点击列表并移动到状态Contact.Detail(ID) ，以查看刚select的项目。 然后select另一个联系人/项目。
这里嵌套状态的好处是：
列表 （状态
Contact） 不重新加载。 而孩子状态Contact.Detail是。
这应该解释为什么“怪异”的行为应该被视为正确的。
回答你的问题，如何处理用户状态。 我会使用路由状态的一些非常高的兄弟姐妹，其分离的视图和控制器以及一些周期的生命周期……在一些周期中触发
真正简短的答案是使用：
$rootScope.$on("$stateChangeStart")
听取任何范围的变化，并采取适当的行动。
较长的答案是，检查小提琴： http : //jsfiddle.net/jasallen/SZGjN/1/
请注意，我使用了app.run，这意味着我正在为每个状态更改parsing用户。 如果您希望在authRoot位于父级时将其限制为状态更改，请将$stateChangeStart检查置于authRoot控制器中。
- 如何检测指令中的当前状态
- 如何使用$ state.go发送和检索参数toParams和$ stateParams？
- AngularJS UI路由器 – 更改url，无需重新加载状态
- 在Angular UI路由器嵌套状态的url更改，但模板不加载
- 到$ routeProvider或$ stateProvider
- 将$ scope注入angular度服务函数（）
- Angular和UI-Router，如何设置一个dynamic的templateUrl
- Angular UI路由器中的$ state.transitionTo（）和$ state.go（）之间的区别
- 使用ui-router和Angularjs自动滚动到TOP
