Angular UI-Router $ urlRouterProvider .when不工作*不再*

问题:为什么我的$urlRouterProvider .when()不再工作?

我拿起了一个相当强大的angular度的应用程序。 我一直试图解决的最近的问题是“页面刷新丢失的用户凭据”问题。

这个项目的authentication服务没有什么意义,当我把它拿起来,经过挖掘,我知道它是从一些随机的代码页面放在一起。 它也没有完全工作,所以我研究了不同的来源,并决定完全实现其中的一个( angular度 – 客户端 – authentication )

现在,我所实现的auth服务/控制器基本上与angular-client-side-auth中的一样 ,但是我正在使用的站点使用基于令牌的身份validation。 令牌function已经基本就位,所以我没有任何麻烦让它工作。

在这一点上,我已经让用户保持login刷新,路由与他们的身份validation一起工作(之前使用庞大的代码来禁用视图中的元素)。但是,现在$urlRouterProvider .when()被打破。 他们以前工作得很好,所以我知道我所做的一切都是错误的 – 但是我不能简单地撤消我已经实施的东西!

所以这是我使用的$ urlRouterProvider代码。 值得一提的是,我已经包含/需要.when() ,而angular度客户端authentication似乎并没有使用它们。 我期望他们可以用这个代码来实现,但是也许有些东西会使.when()的function.when() 。 我不这么认为。 也可以澄清,我还没有使用.rule$httpProvider.interceptors 。 我已经尝试使用这些实现的网站,但他们似乎没有什么区别。

 $urlRouterProvider .when('/myState/group', ['$state', 'myService', function ($state, myService) { $state.go('app.myState.group.id', {id: myService.Params.id}); }]) .otherwise('/'); 

所以基本上,如果用户或站点将用户引导到/myState/group ,他们实际上应该最终在状态app.myState.group.id url? 他们虽然没有,我不明白为什么。 有关使用urlRouterProvider的问题没有太多的。

发生什么? 那么/myState/group的视图加载正常,在它的<ui-view>是一个生成的id列表。 你可以点击一个ID,调用一个设置ID的函数,然后执行$state.go('app.myState.group.id', {id: group.id, std: $scope.std1}); 当然,这个状态代替了用户点击的“生成列表”。

现在,对于.state()的…

 .state('app.myState', { abstract: true, url: '/myState', templateUrl: 'views/myState.html', data: { access: access.user }, controller: 'MyCtrl', resolve: { // bunch of stuff here, I'll include it if it's relevant }, redirectMap: { '409': 'app.error' } }) .state('app.myState.group', { url: '/group', templateUrl: 'views/myState.group.html', data: { access: access.user } }) .state('app.myState.group.id', { url: '/:id', templateUrl: 'views/myState.group.id.html', data: { access: access.user }, resolve: { '': function (myService) { myService.stuff.get(false, false, 7, 0).then(function (data) { }); } }, controller: 'MygroupidCtrl' }) 

最后, index.html

<li ng-class="{active: $state.includes('app.myState')}"> <a ui-sref="app.myState.group">My State</a> </li>

不知何故,我觉得有一个更好的方法来构造这个。 根据我所知道的, app.myState.group 本身并不是真正需要 ,它只是嵌套的一部分。

我试图简单地将ui-sref改为="app.myState.group.id" 。 当没有工作,我也改变$state.includes('app.myState')} $state.includes('app.myState.group')} 。 不。 这是可行的吗? 我知道我必须以某种方式传递身份证,但它似乎不是指挥。

理想情况下,我想限制不必要的状态(和控制器..和一切)的数量。 由于假设用户点击链接时直接进入/myState/group/id ,我觉得应该是这样。 不是这个链接到另一个状态,然后redirect!

也就是说,我现在更关心的是简单地把这个工作,然后我可以担心清理。

编辑

所以当我写这个问题的时候,我正在尝试一些更多的想法。 其中一个实际上工作!

 .state('app.myState.group', { url: '/group', templateUrl: 'views/myState.group.html', data: { access: access.user }, onEnter: ['$state', '$timeout', 'myService', function ($state, $timeout, myService) { $timeout(function () { $state.go('app.myState.group.id', {id: myService.Params.id}) }, 1000); }] 

我喜欢它,但我仍然怀疑是否有其他的方法来做到这一点。 我还好奇为什么$ urlRouterProvider停止工作!

编辑:版本0.2.13 – 改变

原来的post是与UI-Router 0.2.12-一起工作的。 0.2.13中的修复程序禁用了此解决scheme。 请按照这里的解决方法:

Angular UI-Router $ urlRouterProvider。当我点击<a ui-sref="…">时不工作

原版的:

有一个问题,我发现,导致类似的问题。 有一个完整的代码工作的例子

首先,我们有两个function来configuration

  • $urlRouterProvider
  • $stateProvider

这些定义的片段:

 // when config for $urlRouterProvider var whenConfig = ['$urlRouterProvider', function($urlRouterProvider) { $urlRouterProvider .when('/app/list', ['$state', 'myService', function ($state, myService) { $state.go('app.list.detail', {id: myService.Params.id}); }]) .otherwise('/app'); }]; // state config for $stateProvider var stateConfig = ['$stateProvider', function($stateProvider) { $stateProvider .state('app', { url: '/app', ... }]; 

如果我们这样称呼他们,那么报告的行为就会变得更糟。

 angular.module('MyApp', [ 'ui.router' ]) // I. firstly the states .config(stateConfig) // II. then the WHEN .config(whenConfig) 

上述呼叫将不起作用。 列表访问时不会触发详细状态。

但是,这将按预期工作:

 angular.module('MyApp', [ 'ui.router' ]) // I. firstly WHEN .config(whenConfig) // II. only then call state config .config(stateConfig) 

在这里检查。 查看app.js文件…

总结:我们只需要首先configuration$urlRouterProvider 。 只有这样我们才能开始通过$stateProvider来填充我们的状态。 这种方法会导致预期的行为。