javascript - 可以使用 Angular 的 ui-router 限制直接 URL 导航吗？

Question

我想更改状态并从我的 /cart 导航到我的 /checkout 状态，但不允许我的用户直接导航到 /checkout 在他们的浏览器中。这可能吗？

这是他们目前的设置方式:

用户界面路由器

    .state('cart', {
        url: '/cart',
        templateUrl: './views/cart.html',
        controller: 'CartCtrl',
        title: "Shopping Cart",
        requiresLogin: false
    })
    .state('checkout', {
        url: '/checkout',
        templateUrl: './views/checkout.html',
        controller: 'UserCtrl',
        title: "Checkout",
        requiresLogin: false
    })

Controller :

    $scope.goToCheckout = function(){
        $state.go('checkout');
    }

Answer 1

当有人直接导航到页面时，他们是从空状态导航到 URL 定义的状态。您可以使用该事实来阻止导航到 checkout。

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
  if (fromState.name === '' && toState.name === 'checkout') {
    event.preventDefault();
    $state.go('cart');
  }
});