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
来填充我们的状态。 这种方法会导致预期的行为。