2015-08-18 23 views
0

让我说我有一个控制器内像这样的一段代码,在一个角/离子应用:如何在ionicView.leave停止脚本

$scope.$on('$ionicView.beforeEnter', function() { 
    setTimeout(function() { 
     myFunction(); 
    }, 5000) 
}); 

当用户离开映射到该控制器的URL在距离超时5秒之前,脚本不会停止(这是有道理的)。我的问题是:myFunction()打开离子模式。

当用户离开页面并呈现另一个页面时。但是,当渲染另一个视图时,myFunction()将被触发,然后,将在新视图中显示前一视图中的离子模式。我在这个例子中使用了setTimeout(),因为我的代码myFunction()在ajax请求之后被调用(并且我无法控制响应时间)。

有没有办法阻止当前脚本在ionicView.leave事件中执行?

编辑:我发现$范围有一个属性$$断开连接设置为true,当视图离开。我是否需要检查这个值是否为真或是否在我的函数中打开或不打开模态?而且,如果我有'n'个异步函数,是否必须在我所有的'n'函数中检查这个?

编辑II:我实现了一个解决方案包装myFunction的是()A $超时内,指派其返回一个变量,然后和在ionicView.leave,取消它:所以

modaltimeout = $timeout(function() { myFunction();)}; 

$scope.$on('$ionicView.leave', function() { 
    $timeout.cancel(modaltimeout); 
}); 

,不管是什么里面myFunction的(),承诺将被取消,并没有什么事情发生:-)

+0

你能重现问题的[plunker(http://plnkr.co /)? – LeftyX

+0

http://plnkr.co/edit/hGGqHyC0X6xYH66uJRyo?p=preview使用左上方的菜单。更改为“关于”然后快速切换回“主页”。警报将弹出(它也会发生在ionicModal中)。 –

回答

0

所以首先命名您的超时功能:

$scope.$on('$ionicView.beforeEnter', function() { 
    myVar = setTimeout(function() { 
     myFunction(); 
    }, 5000) 
}); 

在控制器的简单加

$scope.$on('$ionicView.beforeLeave', function(){ 
    clearTimeout(myVar); 
}); 

然后,当您离开您的视图时,您的超时将被清除。

编辑!

您可以通过使用.then回调控制何时在http请求后调用某个函数。它会在您的ajax调用完成后运行。这是一个例子。

var req = { 
    url: 'https://yoururl.com', 
    method: "GET", 
    headers: {} 
} 

$http(req).success(function(data, status, headers, config){ 

}).error(function(data, status, headers, config){ 

}).then(function(data, status, headers, config){ 
    //put code here to run after the http call 
}) 

编辑2:在通话的。那么()部分

回只需检查装有何种状态使用

$ionicHistory.currentStateName()

所以它看起来像

.then(fucntion(data, status, headers, config){ 
    if($ionicHistory.currentStateName() === "about"){ 
     //open modal 
} 
}) 

检查以查看您是否处于关于视图。如果你拉起模式,如果不是。容易peasy柠檬squezzy。查看更多有关此检查状态/视图http://ionicframework.com/docs/api/service/ $ ionicHistory/

+0

我已经解释过我正在使用setTimeout来模拟异步调用。问题不在于清除超时,而是为了“停止”异步流程。 –

+0

看到我的编辑,是你在找什么? –

+0

没问题刚刚看到你的闯入者,让我为此做点什么 –

0

您需要将支票添加到处理程序:

$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, options) {...}