ngDialog 关闭事件多次触发 (AngularJS)

Question

我们遇到的问题是当我们侦听事件 'ngDialog.closed' 时，我们发现它触发了多次。我们只打开对话框一次，所以我们假设关闭相同的模式，这个事件也应该只触发一次。整个应用程序有多个模态，我们通过将它附加到 $rootScope 来监听这个特定的模态，如下所示：

         $rootScope.$on('ngDialog.closed', function (e, $dialog) {
          console.log("CLOSED TEHE MODAL", $dialog);
          console.log("EVENT", e);
          if($rootScope.modalFinished && localStorage.getItem("tourComplete") !== "true"){
              $rootScope.modalFinished = false;
              console.log("THIS IS LOCAL STORE:", localStorage.getItem("tourComplete"));
                    $scope.CallMe();
          }
      });

我们通过 $rootScope 监听的原因是将此 "closed" 事件从一个控制器（模态）传递到另一个控制器（主屏幕），该控制器已在模态控制器之前加载。

我们注意到在 'ngDialog.closed' 事件中，多个事件被触发（通常每次关闭模态最多触发 2 到 3 次）。

这是我们打开 ngDialog 的地方（在登录控制器中）：

                      $state.go('app.dashboard')
                      if(AclService.can('edit')|| AclService.can('admin')){

                        $scope.$on('$stateChangeSuccess', function onStateSuccess(event, toState, toParams, fromState){

                          $rootScope.modalFinished = true;
                          CauseService.get().then(function(result){
                            var cause = result[0].attributes;

                            if(!cause.has_backlinked || !cause.has_verified_address){
                              // $rootScope.modalFinished = true;
                              ngDialog.open({
                                template: '../../app/views/dashboard/progress_modal.html',
                                showClose: false,
                                className: 'ngdialog-theme-default progressModal',
                                controller: 'ProgressModalController',
                                resolve:{
                                  'Cause': ['CauseService', function(CauseService){
                                    // console.log("CauseService in routes", CauseService.get());
                                    return CauseService.get();
                                  }]
                                }
                              });
                            }
                          });
                        });
                      }

如有任何帮助，我们将不胜感激。

非常感谢。

-M-

Answer 1

好吧，经过大量的试验和错误，我得出结论，由于将 'ngDialog.close' 事件附加到 $rootScope 并且我们正在监听的控制器已经在模态的控制器加载之前加载，每个控制器将记录模式被关闭的事件。

为了解决这个问题，我将 'ngDialog.close' 事件附加到 $scope，如下所示：

      $scope.$on('ngDialog.closed', function (e, $dialog) {
        if($rootScope.modalFinished && localStorage.getItem("tourComplete") !== "true"){
            $rootScope.modalFinished = false;
            console.log("THIS IS LOCAL STORE:", localStorage.getItem("tourComplete"));
            console.log("****************NGDIALOG IS CALLED")
            $scope.CallMe();
        }
      });

现在只有 one 'ngDialog.close' 事件的预期行为在仪表板控制器中触发。此解决方案还解决了此侦听器在其他 $states 或控制器中的其他模态上被触发的问题。

希望这个回答能帮到别人，如果有任何反馈，我们将不胜感激！！！！

-M-

Answer 2

//In nebular (angular 4+) 
// Closed event identify by below code in nebular lib in Angular 4+


 this.dialogService.open(UpdateUseItemComponent, {
      hasBackdrop:true ,
      closeOnEsc:true,
      autoFocus:true,
      context: {
        data: event
      }
    }).onClose.subscribe(result => {
          this.getStock();
    });

ngDialog 关闭事件多次触发 (AngularJS)

ngDialog closed event fires multiple times (AngularJS)

event-listener

angularjs

ng-dialog