Javascript $state.go in解析不工作
所以我设置了这些路线:Javascript $state.go in解析不工作,javascript,angularjs,angular-ui-router,Javascript,Angularjs,Angular Ui Router,所以我设置了这些路线: .state('createOrder', { url: '/customer-services/orders/create', templateUrl: 'tpl/customerServices/orders/save.html', controller: 'SaveOrderController', controllerAs: 'controller', resolve: { order: ['SaveOrde
.state('createOrder', {
url: '/customer-services/orders/create',
templateUrl: 'tpl/customerServices/orders/save.html',
controller: 'SaveOrderController',
controllerAs: 'controller',
resolve: {
order: ['SaveOrderService', function (shared) {
shared.order = { forDelivery: true };
}]
},
data: {
requireLogin: true,
pageTitle: 'Add order'
}
}).state('createOrder.lines', {
url: '/lines',
views: {
'@': {
templateUrl: 'tpl/customerServices/orders/save/line.html',
controller: 'SaveOrderLinesController',
controllerAs: 'controller'
}
},
resolve: {
validate: ['$state', 'SaveOrderService', function ($state, shared) {
// If we don't have an account number
if (!shared.order.accountNumber) {
console.log('redirecting');
// Redirect to the create order view
$state.go('createOrder');
}
}]
},
data: {
requireLogin: true,
pageTitle: 'Add order : Lines'
}
})
但国家并没有改变。我认为某个地方可能有错误,所以我订阅了如下状态事件:
// On state change
$rootScope.$on('$stateChangeStart', function (event, toState) {
var data = toState.data; // Get our state data
var requireLogin = typeof data === 'undefined' ? false : data.requireLogin; // Check to see if we have any data and if so, check to see if we need login rights
var user = service.get(); // Get our current user
console.log(toState);
$rootScope.currentUser = user; // Set our current user on the rootScope
// If we require login rights and we are not authenticated
if (requireLogin && !user.authenticated) {
event.preventDefault(); // Stop processing
$state.transitionTo('login'); // And redirect to the login page
}
});
$rootScope.$on('$stateNotFound', function () {
console.log('state not found');
});
$rootScope.$on('$stateChangeError', function () {
console.log('state errored');
});
$rootScope.$on('$stateChangeSuccess', function () {
console.log('state changed');
});
当我刷新我的行视图时,控制台输出以下内容:
Object { url: "/lines", views: Object, resolve: Object, data: Object, name: "createOrder.lines" } app.js:42:9
redirecting app.js:2436:21
Object { url: "/customer-services", templateUrl: "tpl/customerServices/index.html", controller: "CustomerServicesController", controllerAs: "controller", data: Object, name: "customerServices" } app.js:42:9
state changed app.js:63:9
Object { order: Object, account: null, collectionPoint: null }
正如您所看到的,这些州认为它们已经改变了,但我仍然看到createOrder.lines视图。
有人知道为什么吗?我认为您需要将$state更改包装到一个函数中,该函数将触发摘要循环,同时拒绝解析方法中的承诺
$timeout(function() { $state.go("createOrder") });
return $q.reject("Rejection message!");
记住在解析函数中插入$timeout和$q!=)
还应补充一点,拒绝解决将引发stateChangeError。因此,您不需要承诺。只需添加超时即可。 我发现了另一篇文章,其中建议需要超时来避免摘要问题(我猜这是导致我的状态没有改变的原因)。 以下是最终代码:
validate: ['$state', '$timeout', 'SaveOrderService', function ($state, $timeout, shared) {
// If we don't have an account number
if (!shared.order.accountNumber) {
// Timeout to avoid digest issues
$timeout(function () {
// Redirect to the create order view
$state.go('createOrder');
});
}
}]
您是否包含了
SaveOrderLinesController的validate
依赖项?但没有承诺?还是我遗漏了什么?在你最初的“否”中没有承诺,但你可以用它们向路由器发出状态更改不应成功的信号。最好在stateChangeStart中处理它,但我可以看到您需要访问SaveOrderService才能确定这一点。超时函数的用途是什么?$timeout启动另一个摘要-告诉angular更新-它可以立即触发,因此没有传入任何数字