Question

这是我的代码HTML：

<div ng-click="changeBorder(value)" ng-class="{active_borders:isActive(value)}" ng-repeat="value in values">
            <img class="card-img-bottom" src="{{value.Imagen}}" />
        </div>

这是我的代码javascript：

$scope.isActive = function isActive(value){return $scope.valueSelected.Id==value.Id;}

$scope.changeValue=function changeValue(value){$scope.valueSelected=value;}

说明：我要做的就是当我点击包含img的div时，所以当我进行选择图像时，我想绘制该div的边框，只绘制那个div的边框。因此，如果我点击一个div而在其他div之后应该绘制它应该是我点击的最后一个。

我的问题：问题是函数isActive（value）运行两次，运行一次，即运行ng-repeat时，如果我写的话。

我不希望被运行两次，因为我要在该方法中添加额外的东西来与我的数据库进行通信，如果它不断地与我的数据库进行通信将是一个问题。数据库中。

Answer 1

当某些内容发生变化时，Angular会经常多次在范围内运行函数，直到所有内容都解决为止。这是必要的，因为依赖性可能导致一个范围变量的更改影响另一个范围变量。如果这种行为有问题，您需要考虑不同的方法，因为您无法阻止它发生。 IsActive应该只做一件事：返回对象是否处于活动状态。它不应该进行API调用。考虑一下你正在尝试实现和重新设计控制器以避免多次调用。

编辑：我应该澄清：在某些情况下可以防止多次调用，但依赖于那里只有一次调用是一个错误，并且在内部调用API的方法是真的喜欢＆＃34; GET（读取方法）＆＃34;是错误的方式。

Answer 2

试试这个，确保默认值$scope.valueSelected = {}否则它会抛出一个错误，无法读取未定义的属性id。

<div ng-click="changeBorder(value)" ng-class="{'active_borders':valueSelected.Id==value.Id}" ng-repeat="value in values">
    <img class="card-img-bottom" src="{{value.Imagen}}" />
</div>

Answer 3

isActive评估两次的原因是，每当Angular触发摘要周期时，它会评估您网页的所有绑定，以使您的网页与与其绑定的模型保持同步。这是AngularJS应用程序中的正常行为。另外，如果从性能角度考虑，它不会以任何方式损害性能，因为它是两个变量的$scope.valueSelected.Id==value.Id;（等式检查）。

目前isActive函数正在运行两次，或者运行次数多于此次（取决于摘要周期运行），这完全取决于应用程序在做什么。

我不想再跑两次，因为我要添加额外的东西在该方法中将与我的数据库和它进行通信如果它不断地与数据库通信将是一个问题。

对于您正在思考的内容，将API / network call置于binding函数中的不良做法是不可取的。你去做它，然后该功能将继续调用无限时间，消化周期永远不会稳定。

相反，我建议您将数据库调用保留在$scope.changeValue方法中，只有在用户执行某些操作时才会调用此方法。这很有道理，因为我们在架构的角度来看应该做什么应用程序。

Answer 4

可能你很多人需要如下。 id =“{{value.id}}”

collections.abc.Collection

Ng级别的工作正如我预期的ng-repeat一样

4 个答案: