AngularJS观察DOM的变化

前端之家收集整理的这篇文章主要介绍了AngularJS观察DOM的变化前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个自动轮播指令,通过链接元素的孩子迭代。

然而,孩子们还没有加载到DOM中,因为他们的ng-ifs表达式还没有被解析。

如何确保父指令知道它的DOM树有更改?

<ul class="unstyled" auto-carousel>
          <li class="slide" ng-if="name">{{name}}</li>
          ...
          <li class="slide" ng-if="email">{{email}}</li>
        </ul>

我可以使用$超时,但感觉不可靠。我也可以使用ng-show而不是ng-if,但这不回答问题,而不是我需要的。

所以这里是我最后做的:

我发现你可以传递一个函数到$ scope。$ watch。从那里,很容易返回你想要监视的变化的表达式的值。它将像传递范围上的属性的键字符串一样工作。

link: function ($scope,$el,$attrs) {
  $scope.$watch(
    function () { return $el[0].childNodes.length; },function (newValue,oldValue) {
      if (newValue !== oldValue) {
        // code goes here
      }
    }
  );
}

我正在监视childNodes,而不是孩子,因为childNodes列表包含元素以及文本节点和注释。这是无价的,因为Angular使用注释占位符像ng-repeat,ng-if,ng-switch和ng-include来执行互斥和改变DOM,而孩子只保存元素。

原文链接:https://www.f2er.com/angularjs/145346.html

猜你在找的Angularjs相关文章