Question

我对Angular很新，所以我还没有弄清楚它的所有小怪癖。目前我有一个按钮，用ng-click =＆＃34;打开（）＆＃34;打开叠加层。在叠加层内有另一个按钮，用ng-click =＆＃34; close（）＆＃34;来关闭叠加层。

现在看来，如果视图中存在另一个事件，则不会触发ng-click事件。如果ng-click =＆＃34; open（）＆＃34;存在，ng-click =＆＃34; close（）＆＃34;不会开火，反之亦然。

这是我正在谈论的更简单的版本，因为我正在处理的实际应用程序有点沉重：

查看

<button ng-click="open()">Open</button>

<div id="overlay">
   <button ng-click="close()">Close</button>
</div>

控制器

$scope.open = function(){
   //some move.js to open the overlay
}

$scope.close = function(){
   //some move.js to close the overlay
}

叠加层不是动态生成的，而是呈现给页面上载。

以下是@sz tech提供的解决方案。不是$ compile方法。 http://codepen.io/NicholasByDesign/pen/WwqMXa?editors=1010

请注意，因为我不认为这会有所作为。我在nodejs和jade环境中工作。我把它作为常规HTML，并省略了包含打开/关闭功能的控制器代码，以简化操作。

Answer 1

问题是您正在更新（div.innerHTML += "close";）包含角度代码（ng-click="close()"）的div，并且绑定将消失，尝试在更新后重新编译div并且它将起作用。试试这段代码：

 var app = angular.module('myApp', []);
   app.controller('appCtrl', function($scope,$compile) {
   var div = document.getElementById('div');

   $scope.open = function(){
     div.innerHTML += "open";
         $compile(div)($scope);
   }

   $scope.close = function(){
     div.innerHTML += "close";
         $compile(div)($scope);
   }
});

正如您所看到的，我重新编译div并将当前范围绑定到它，它将起作用。以下是工作示例：http://codepen.io/anon/pen/PNrRKL?editors=1010

Answer 2

试试吧

var app = angular.module('myApp', []);
app.controller('appCtrl', function($scope) {
   var div = angular.element(document.getElementById('div'));

   $scope.open = function(){
       div.append("open");
   }

   $scope.close = function(){
       div.append("close");
   }
});

在父ng-click事件之后，不会触发Angular child ng-click事件

2 个答案: