javascript - $state.go 解决方案不起作用

标签 javascript angularjs angular-ui-router

所以我设置了这些路线:

.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');
});

当我刷新我的 View 时,控制台输出:

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 View 。 有谁知道为什么吗?

最佳答案

我认为您需要将 $state 更改包装在一个函数中,该函数将触发摘要周期,同时拒绝解析方法中的 promise ...

$timeout(function() { $state.go("createOrder") });
return $q.reject("Rejection message!"); 

记住将 $timeout 和 $q 注入(inject)到您的解析函数中! =)

还应该添加拒绝解析将引发 stateChangeError。

关于javascript - $state.go 解决方案不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32595726/

相关文章:

javascript - 将组元素重新排序为特定顺序

javascript - Angular 2 如何使用路由器和 location.go() 检测后退按钮按下?

javascript - 使用 ui-sref 在按钮标签中触发状态

javascript - For 循环立即打印所有循环的 console.log() ,而循环的其余部分仍然运行?

javascript - li 鼠标悬停的动态 id

javascript - SVG 路径字符串上的 bool 运算

javascript - 如何修复模板缓存中的模板路径? (gulp-angular-templatecache)

javascript - 带双点的 Angular 电子邮件验证

angularjs - D3.js 没有用 Electron 定义

angularjs - 使用 Angular UI 路由和 UI 模态在 AngularJS 中创建有状态的模态