javascript - 销毁在 ngDialog 模式中启动的 AngularJS $interval

Question

我有一个显示数据表的模式。底层数据使用 $http 和 $interval 每隔几秒更新一次，但仅在模态显示时才更新。我正在为模态使用ngDialog库。我需要更新以在模式关闭时停止，但我不知道触发这种破坏的最佳方法。一些代码：

$scope.openModal = function() {

var refreshModal = function() {
   $http({
       params: {proj_id: $scope.projectId},
       url: '/projects/_get_data',
       method: 'GET'
   })
   .success(function(data, status, headers) {
       $scope.modalData = data.data;
       $scope.updateModal()           
   })
   .error(function(data, status, headers) {
       console.log('it didnt work');
   }); 
}

refreshModal();

$interval( function() { refreshModal(); }, refreshRate);

ngDialog.open({ template: 'ModalId', scope: $scope, className: 'table-modal', showClose: false });

};

如何检测模态关闭？

谢谢。

Answer 1

最好的办法是将您的 $interval 实例传递给模态关闭事件，并在关闭模态时将其杀死。

就像是：

var interval = $interval( function() {refreshModal(); }, refreshRate);
var dialog = ngDialog.open(...);
$rootScope.$on('ngDialog.closed', function (e, $dialog) {
     //identify if the dialog instance closing is the one the interval is for
     if ( areTheSame(dialog, $dialog) ){
          $interval.cancel(interval);
     }  
 });

编辑：对于@zbycz 另一个更简洁的解决方案是使用对话框具有closePromise的事实：

var interval = $interval( function() {refreshModal(); }, refreshRate);
var dialog = ngDialog.open(...);
dialog.closePromise.then(function(){
    $interval.cancel(interval);
});