父级ng-click事件后，angular度子级ng-click事件不会触发

我对Angular来说很新颖，所以我还没有想出所有的小怪癖。 目前我有一个button，用ng-click =“open（）”打开覆盖。 在叠加层中还有另一个button，用ng-click =“close（）”closures叠加层。

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

下面是我正在谈论的一个简单的版本，因为我正在对实际的应用程序进行一些处理：

视图

<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 } 

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

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

只是一个方面说明，因为我不认为这将有所作为。 我在一个nodejs和jade环境中工作。 我把它作为普通的HTML，省去了封装了打开/closuresfunction的控制器代码来简化事情。

Answer 1

问题是你正在更新（ div.innerHTML += "close"; ）包含angular码（ 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"); } });