角度状态 - 退出前解决

时间:2015-07-07 21:05:16

标签: angularjs angular-ui-router

我的Angular应用程序包括一个主屏幕和几个标签,我正在使用$stateProvider来切换状态。每当我离开tab(= state)时,我必须执行异步操作。我想在实际移动到新选项卡之前等待该操作完成。有点像resolve离开状态而不是进入时完成。

如何实现这一目标?

示例摘录

$stateProvider
    .state('myproject.main', {
        url: '/main',
        templateUrl: '...',
        controller: 'MainCtrl'
    })
    .state('myproject.tabs.a', {
        url: '/tab_a',
        controller: 'TabACtrl',
        templateUrl: '...',
        onExit: doSave
    })
    .state('myproject.tabs.b', {
        url: '/tab_b',
        controller: 'TabBCtrl',
        templateUrl: '...',
        onExit: doSave
    });

function doSave(MyService) {
    return MyService.save(); //async, promise
}

这里我想在标签之间切换时保存(异步)。但是当从选项卡进入主状态时,我想确保保存已完成(在myproject.main上执行保存onEnter / resolve对我不利)。

问题:输入myproject.main(MainCtrl)时,异步MyService.save()操作仍在处理中。我希望它能够完成/解决。

我尝试使用以下代码破解它,但不起作用 - 状态更改进入循环

.run(function($rootScope, $state, $stateParams, MyService){
    $rootScope.$on('$stateChangeStart', function(ev, toState, toParams, fromState, fromParams){
        if (toState.name === 'myproject.main' && //switching to main
            fromState.name && //for a certain tab
            fromParams.resume !== true ) {

              ev.preventDefault(); //stop the state change
              //do the save and then continue with the state change
              MyService.save().then(function(){
                $state.go(toState, {resume: true}) //continue with a "resume" parameter
              });
        }
    });             
});

谢谢!

0 个答案:

没有答案