javascript - Angular : DOM manipulation of ng-repeat elements in a directive

Question

我是 angularJS 的新手。我正在尝试实现一个简单的功能，其中有许多复选框选项，并且需要在单击这些复选框选项时调用一个特定的功能，类似于

 $(parentDiv).on("click",'input[type="checkbox"]', functionToBeCalled});

我正在尝试为该部分使用一个指令，其内容类似于

 <div>
    <span ng-repeat="subsection in section"><input type="checkbox"  value="subsection.name"></input> {{subsection.name}} </span>
</div>

目录

app.directive('myDir', function() {
  return {
    restrict: 'AE',
    replace: true,
    templateUrl: 'filter.html',
    link: function(scope, elem, attrs) {
      elem.find("input").bind('click', function() {
        //do some data manipulation
      });
    });
 };
});

当我使用链接函数时，我发现如果我使用 elem.find('input[type="checkbox"]) 会给我一个空对象，因此在此之前它不会被编译。请让我知道如何解决这种情况。我做了一些研究，发现了在链接之前操作 DOM 的编译函数，但我无法想到 future 的方法。任何帮助将不胜感激。提前致谢。

Answer 1

在angularjs中使用ngClick或ngChange指令

<div>
    <span ng-repeat="subsection in section">
    <input type="checkbox"  value="subsection.name" ng-click="myFunc(subsection.name)" /> {{filter.name}} </span>
</div>

在示例中，我使用了 ng-click = "myFunc"并将值传递给该函数