$ modal ui-router击中逃脱改变状态

时间:2014-08-14 00:22:05

标签: angularjs angular-ui-bootstrap angular-ui-router

我想让我的webapp恢复到当用户遇到逃脱或点击popop时所处的状态。现在它只在用户点击触发$ scope.close函数的okay按钮时才有效。

.state('rates.rate.runexperiment', {
    url: "/runexperiment",
    onEnter: ['$stateParams', '$state', '$modal', function($stateParams, $state, $modal){
        $modal.open({
            templateUrl: "templates/ExpsResults.html",
            controller: ['$scope', 'ExpsService', function($scope, ExpsService) {

                $scope.expResults = null;

                $scope.getExpResults = function(){
                    ExpsService.getExpResults('1000').get().then(function(response){
                        $scope.expResults = response;
                    });
                };

                $scope.close = function() {
                    $scope.$close(true);
                    $state.go('rates.rate');
                };

                $scope.getExpResults();
            }]
        })
    }]
})

所以现在他们点击弹出窗口之前的url是myendpoint / rates / rate。然后,当他们点击弹出窗口时,它会打开,网址为myendpoint / rates / rate / runexperiment。然后,当他们逃脱或点击弹出窗口时,窗口就会消失,但状态仍然是myendpoint / rates / rate / runexperiment。它在用户单击“okay”按钮并且返回到myendpoint / rates时起作用。

我在.state中尝试过onExit功能,但没有让它工作。有什么建议吗?

1 个答案:

答案 0 :(得分:2)

您可以使用modal承诺在点击背景或按下esc时捕获事件。

   var modalInst = $modal.open({
        templateUrl: "templates/ExpsResults.html",
        controller: ['$scope', 'ExpsService', function($scope, ExpsService) {

            $scope.expResults = null;

            $scope.getExpResults = function(){
                ExpsService.getExpResults('1000').get().then(function(response){
                    $scope.expResults = response;
                });
            };

            $scope.close = function() {
                $scope.$close(true);
                $state.go('rates.rate');
            };

            $scope.getExpResults();
        }]
    })


    modalInst.result.then(function () {

    }, function () {//This will be triggered on dismiss/Esc/backdrop click
       $state.go('rates.rate');
    });

//或者只是使用finally来重定向whenevr模态关闭。

    modalInst.result.finally(function () { // or .result[finally](
        //Will be triggered always.
        $state.go('rates.rate'); 
    });

并从关闭功能中删除state.go