javascript - ng-repeat 运行两次(Angular)

标签 javascript angularjs angularjs-ng-repeat

考虑以下 ng-repeat:

<p ng-repeat="item in items">
    <span ng-bind="getName(item)"></span>
</p>

现在奇怪的是,如果我有一个包含 10 个项目的数组,则 getName 会被调用 20 次

看看这个 jsfiddle

有人可以解释为什么会发生这种情况吗?就性能而言,这可能是一场杀戮(我可以想象)

最佳答案

这是 Angular 的标准行为。 Angular 对值运行脏检查,并且至少运行两次以确保值没有更改。

编辑:

为了避免这种行为,我建议在 Controller 中映射此名称,每个项目只会评估一次:

function MyCtrl($scope) {
    ...
    $scope.items.forEach(function(item) {
        item.name = getName(item);
    });
    ...
});


<p ng-repeat="item in items">
     <span>{{item.name}}</span>
</p>

关于javascript - ng-repeat 运行两次(Angular),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27178164/

相关文章:

javascript - 限制 html5 类型 ="number"输入字段中的小数位数(使用 Angularjs 模型)

AngularJS:如何在 Controller 内的 onsubmit 上调用函数作为 ng-submit

angularjs - Angular - 可以在 ng-repeat 中获取最新项目

javascript - angularjs ng-table/ng-repeat 行未加载

javascript - Angular : Pass $scope variable as directive attribute

javascript - 如何使用JS替换字符串?

javascript - 如何在加载控件时触发函数

javascript "prompt is not defined"引用错误

php - HTTP Post 方法不适用于 AngularJS + PHP + MySQL

javascript - Angular : Display 2D Array in table format