Deporting/moving UI 状态定义之外的路由器解析函数定义
Deporting/moving UI router's resolve functions definitions outside of the state definitions
截至目前,我已将所有州的定义放在一个 app.js
文件中。挺喜欢的,因为一眼就能看到自己的所有状态
不过,我计划向我的每个状态添加一些解析函数,如下所示。
.config(['$stateProvider', '$urlRouterProvider', '$httpProvider', function ($stateProvider, $urlRouterProvider, $httpProvider) {
$stateProvider
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: ['$rootScope', '$q', function ($rootScope, $q) {
return $rootScope.globals.memberType || $q.reject({unAuthorized: true});
}],
currentMember: ['$rootScope', '$q', function ($rootScope, $q) {
return $rootScope.globals.authenticated || $q.reject({unAuthorized: true});
}]
}
})
...
我遇到的问题是我的解析函数会变得非常大,我的 app.js
文件会变得不成比例。
因此,我想 deport/move 我的 app.js
文件之外的解析函数定义,但将状态保留在同一个唯一文件中。这可能吗?如果有怎么办?
理想情况下,我会得到这样的结果:
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: something??,
currentMember: something else??
}
})
something
和 something else
指向外部定义的函数定义。
有人可以帮忙或提供替代的最佳做法吗?
按照上面的评论,您可以使用服务来实现业务逻辑并在解析块中调用服务功能。这是可能的,因为解析代码不是作为配置块的一部分执行的,而是在状态更改之前执行的。您只需将服务注入解析块中的函数。
这是一个基于您的代码示例的示例:
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: ['MemberService', function(MemberService) { return MemberService.getMemberType(); }],
currentMember: ['MemberService', function(MemberService) { return MemberService.getCurrentMember(); }]
}
})
截至目前,我已将所有州的定义放在一个 app.js
文件中。挺喜欢的,因为一眼就能看到自己的所有状态
不过,我计划向我的每个状态添加一些解析函数,如下所示。
.config(['$stateProvider', '$urlRouterProvider', '$httpProvider', function ($stateProvider, $urlRouterProvider, $httpProvider) {
$stateProvider
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: ['$rootScope', '$q', function ($rootScope, $q) {
return $rootScope.globals.memberType || $q.reject({unAuthorized: true});
}],
currentMember: ['$rootScope', '$q', function ($rootScope, $q) {
return $rootScope.globals.authenticated || $q.reject({unAuthorized: true});
}]
}
})
...
我遇到的问题是我的解析函数会变得非常大,我的 app.js
文件会变得不成比例。
因此,我想 deport/move 我的 app.js
文件之外的解析函数定义,但将状态保留在同一个唯一文件中。这可能吗?如果有怎么办?
理想情况下,我会得到这样的结果:
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: something??,
currentMember: something else??
}
})
something
和 something else
指向外部定义的函数定义。
有人可以帮忙或提供替代的最佳做法吗?
按照上面的评论,您可以使用服务来实现业务逻辑并在解析块中调用服务功能。这是可能的,因为解析代码不是作为配置块的一部分执行的,而是在状态更改之前执行的。您只需将服务注入解析块中的函数。
这是一个基于您的代码示例的示例:
.state('authenticated', {
url: '/:memberType',
abstract: true,
template: '<ui-view />',
resolve: {
memberType: ['MemberService', function(MemberService) { return MemberService.getMemberType(); }],
currentMember: ['MemberService', function(MemberService) { return MemberService.getCurrentMember(); }]
}
})