AngularJS – 将元素附加到指令内的每个ng-repeat迭代

发布时间：2020-12-17 07:57:58 所属栏目：安全来源：网络整理

导读：我在 tr里面使用了ng-repeat.元素和指令. HTML： tbody tr ng-repeat="row in rows" create-table td nowrap ng-repeat="value in row | reduceString{{value}}/td /tr/tbody 指示： app.directive('createTable',function () { return { link: function (sc

我在< tr>里面使用了ng-repeat.元素和指令.

HTML：

<tbody>
  <tr ng-repeat="row in rows" create-table>
    <td nowrap ng-repeat="value in row | reduceString>{{value}}</td>
  </tr>
</tbody>

指示：

app.directive('createTable',function () {
        return {

            link: function (scope,element,attrs) {
                var contentTr = scope.$eval('"<tr ng-show=&quot;false&quot;><td>test</td></tr>"');
                $(contentTr).insertBefore(element);
            }
        }
    }
);

虽然我可以添加一个新的< tr>每次迭代的元素,我都无法在将角色代码添加到DOM后执行(例如< tr>中的ng-show).我错过了一些明显的东西吗

您没有在您的孩子内部获得Angular绑定的原因是因为您缺少 compiling.当链接函数运行时,元素已经被编译,因此,Angular增强了.您所要做的就是手动编译您的内容.首先,不要评估您的模板,否则您将丢失绑定提示.

app.directive('createTable',function ($compile) {
  return {
    link: function (scope,attrs) {
      var contentTr = angular.element('<tr ng-show=&quot;false&quot;><td>test</td></tr>');
      contentTr.insertBefore(element);
      $compile(contentTr)(scope);
    }
  }
});

另一个提示：你永远不会将你的元素包含在jQuery($)中.如果您的页面中有jQuery,则所有Angular元素都已经是jQuery增强元素.

最后,解决所需问题的正确方法是使用指令编译函数(读取‘Compilation process,and directive matching’ and ‘Compile function’)在编译之前修改元素.

作为最后的努力,阅读整个Directive guide,这是一个宝贵的资源.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!