Angular指令正在多次加载

问题描述 投票:1回答:3

这是Angular中的bug还是我缺少某些东西:

从指令的模板中调用函数表明该函数已执行11次!与templateurl,和22倍!带有字符串模板。

angular.module('testDirective', [])
        .directive('myDirective', function() {
          return {
            scope:{},
            template: '{{increment()}} {{count}}',
            controller: function($scope) {

              $scope.count = 0;

              $scope.increment = function() {
                $scope.count += 1;
              };
            }
          };
        })

HTML:

<body ng-app="testDirective">
    <my-directive></my-directive>
</body>

结果:

22

Here is a Plunker同时使用template和templateUrl方法。

作为示例,在中继器中涉及方法调用时,这是一个相当大的问题,这最终导致调用同一方法的时间大大超过了应有的时间。

任何人都可以对此有所了解吗?

这是Angular中的bug还是我缺少一些东西:从指令的模板中调用一个函数显示该函数执行了11次!与templateurl,和22倍!带有字符串...

angularjs directive
3个回答
5
投票
每次调用摘要循环时,都会调用

{{increment()}},就像任何绑定表达式一样。如果要增加控制器功能本身,而不是从视图模板中调用绑定函数,则表明该指令多次“加载”。但是Angular的本质是,将在摘要周期内重复检查任何绑定表达式的变化,并且您期望仅发生一次(甚至可预测的次数)的任何事情都永远不会在绑定到内容的表达式内部发生元件。另一方面,绑定到事件处理程序的表达式仅在事件触发时执行。


1
投票
[我还发现与同一问题相关的这篇帖子很有用:Using ng-class with a function call - called multiple times

0
投票
increment()。加载时,将调用increment(),并且计数增加1,这将导致视图更新并再次调用increment()
© www.soinside.com 2019 - 2024. All rights reserved.