Question

如果在statis链接上使用angular js脚本的ng-click属性，它可以很好地运行下面的代码

<div class="modal fade" id="cModal" ng-controller="modalController">
  <li id="modalp1" class="active"><a ng-click="parentOptions()" href="#">Add Parent</a></li>
</div>

如果通过jquery append（）或prepend（）方法动态创建示例链接，则单击事件不起作用。示例代码如下所示。

$('#cpartners').prepend("<li><a ng-click=\"parentOptions()\" href=\"#\">Add Parents (Mother & Father)</a></li>");

控制器示例代码如下所示

function modalController($scope) {
  $scope.sthumbEdit = function() {
    $(".dur").show();
  };
  $scope.hthumbEdit = function() {
    $(".dur").hide();
  };
  $scope.parentOptions = function() {
  prepareParentOptions();
  };

  $scope.siblingOptions = function() {
   prepareSiblingOptions();
  };

  $scope.childOptions = function() {
   prepareChildOptions();
  };

}

是否有任何方法可以强制执行ng-click属性在dyanmically生成的链接上运行良好。

Answer 1

如果使用jquery添加html，则需要编译内容并将其注入DOM。像

这样的东西

var element = $compile('<p>{{total}}</p>')(scope);

有关示例http://docs.angularjs.org/guide/compiler

，请参阅“如何编译指令”部分

Answer 2

直接从控制器更改DOM是一个错误，您不应该这样做，而是需要使用指令来创建“自定义元素”和服务。

如果使用AngularJS，直接使用Jquery编辑DOM会适得其反，如果你想使用Jquery，你必须将它包装在一个指令中。

我建议您AngularJS tutorial以便更好地理解AngularJS，并NGmodules包含许多可以帮助您的Angularjs模块。

ng-click对通过jquery append创建的链接不起作用

2 个答案: