如何知道 ui-router 中的下一个状态答案

【问题标题】：How to know next state in ui-router如何知道 ui-router 中的下一个状态
【发布时间】：2014-01-11 21:17:34
【问题描述】：

当用户进入特定状态 (/login) 时，我会显示和隐藏模式，但如果用户从 /login 进入 /register，我会将模式保留在后台。

如果用户在/login然后转到/register，我会保持登录模式保持打开状态，而如果用户在/login然后转到不同的页面，我会登录模式消失。

其实我是这样设置Angular-ui-router$stateProvider的：

app.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
  $stateProvider
    .state('home', {
      url: "/",
      templateUrl: "templates/home.html",
      controller: 'HomeCtrl'
    })
    .state('login', {
      url: "/login",
      onEnter: function ($stateParams, $state, Modal) {
        // * modalCtrl for Login
        if (window.loginModal) {
          window.loginModal.remove();
          delete window.loginModal;
          Modal.fromTemplateUrl('templates/user/login.html', function (modal) {
            window.loginModal = modal;
            loginModal.show();
          });
        } else {
          Modal.fromTemplateUrl('templates/user/login.html', function (modal) {
            window.loginModal = modal;
            loginModal.show();
          });
        }
      },
      onExit: function ($stateParams, $state) {
        if ( window.loginModal && /* condition like "!nextState.is('register')" */ ) {
          window.loginModal.hide();
        }
      }
    })
    .state('register', {
      url: "/register",
      onEnter: function ($stateParams, $state, Modal, SlideBoxDelegate) {
        // * modalCtrl for Register
        if (window.registerModal) {
          window.registerModal.remove();
          delete window.registerModal;
          Modal.fromTemplateUrl('templates/user/register.html', function (modal) {
            window.registerModal = modal;
            SlideBoxDelegate.update();
            registerModal.show();
          });
        } else {
          Modal.fromTemplateUrl('templates/user/register.html', function (modal) {
            window.registerModal = modal;
            SlideBoxDelegate.update();
            registerModal.show();
          });
        }
      },
      onExit: function ($stateParams, $state) {
        if ( window.registerModal ) {
          window.registerModal.hide();
        }
      }
    })
    .state('not_found', {
      url: "/not_found",
      templateUrl: 'templates/not_found.html',
      controller: 'NotFoundCtrl'
    })
  $urlRouterProvider.otherwise("/not_found");
  $locationProvider.html5Mode(true);
})

有没有办法设置condition like "!nextState.is('register')"？

感谢您的阅读:)

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

您可以侦听$stateChangeStart 并注意to 参数的值，该值是您的onExit 函数可访问的某个位置，即可注入值或服务。

将来，将有一个可注入的服务来代表转换本身，您将能够检查和操作此类事情。

【讨论】：

关于这项服务的任何消息？
如果onExit 回调有 toState 和 toParams 就像$stateChangeStart 一样，那就太好了。同样适用于onEnter

【解决方案2】：

到目前为止，我发现的最好的技巧是在 $state 服务中使用承诺，在 onExit 函数中：

onExit: function ($state) {
  $state.transition.then(toState => {
    if (toState.name === 'nameOfTheWantedNextState') {
      $state.go($state.current, {}, {reload: true});
    }
  })
}

这避免了监听事件并将名称存储在某处，它只使用转换时可用的内容。相当整洁！

【讨论】：