ng-click 不适用于动态 DOM AngularJS？答案

【问题标题】：ng-click doesn't work on dynamic DOM AngularJS?ng-click 不适用于动态 DOM AngularJS？
【发布时间】：2013-04-30 09:15:36
【问题描述】：

我有一个这样的控制器：

@VariantModalCtrl = ($scope) ->
  $scope.upload_variant_image = ->
    alert("test")

当我尝试使用 ng-click 调用 upload_variant_image 函数时，它仅在绑定到静态 DOM 时才有效（当 DOM 加载时），我有一个这样的链接：

<%= link_to "test", "" , "ng-click" => "upload_variant_image()" %>

但是这个元素是在 DOM 加载后动态添加的，所以 ng-click 不起作用。

但是当我在 Rails 中像这样更新 DOM 时它不起作用：

$(".modal-body").html($compile("<%= j render("/variants/form", :variant => @variant) %>")(scope));

【问题讨论】：

【解决方案1】：

我会警告你，如果你通过 Angular 外部方式来操作 DOM，你可能还没有完全接受 Angular 哲学。使用 AngularJS 动态添加链接与其他任何事情一样简单，并且可能比让您的外部库运行得更好更容易和更惯用。这是一个基于您的问题的简单示例：

<ul>
  <li ng-repeat="item in items">
    <a ng-click="upload_variant_image()">{{item.name}}</a>
  </li>
</ul>

您需要做的就是适当地连接示波器数据，这将始终“正常工作”。

也就是说，如果您正在操作 DOM，您可以通过使用 $compile service 导致发生 AngularJS 绑定（例如，根据需要进行 ng-click）。不过，请考虑上述更好的选择。 :)

【讨论】：