Question

我正在尝试在angular-ui bootstrap模态控制器中监听事件，而我无法理解为什么我的模态的新实例会复制事件监听器。

在以下代码和plunkr中，重复触发测试函数会运行事件处理程序的重复版本。

var app = angular.module('plunker', [
    'ui.bootstrap'
  ]);
app.controller('ModalInstanceCtrl', function($scope, $modalInstance) {
  $scope.$on("test", function(event, x) {
    console.log("Test! " + x);
  });
})

app.controller('MainCtrl', function($rootScope, $scope, $modal,$timeout) {
  $scope.name = 'World';

  $scope.test = function() {
    var modalInstance = $modal.open({
      backdrop: 'static',
      templateUrl: 'modal.tpl.html',
      controller: 'ModalInstanceCtrl'
    });

    var sequence = $timeout(function(){});
    [1,2,3,4,5].forEach(function(x) {
      sequence = sequence.then(function() {
        return $timeout(function() {
          $rootScope.$broadcast("test", x);
        }, 1000);
      });
    });
    sequence.then(function() {
      modalInstance.dismiss('complete');
    });
  }
});

Answer 1

它是ui-bootstrap版本0.10.0中已知（和修复）的错误，模态窗口关闭后模态范围不会被破坏：https://github.com/angular-ui/bootstrap/issues/1643

Angular UI Bootstrap模式是重复事件监听器，不知道为什么

1 个答案: