当数据更改时,Angular执行 功能以更新DOM。
在摘要过程中,它将重新计算您在DOM中绑定的所有值,在本例中为{{RandomColorClass()}}。如果其中任何一个发生更改,它将再次执行摘要循环(例如,因为某些变量可能取决于更改后的变量的值)。
它会重复执行此操作,直到连续两次摘要产生相同的值-即,没有任何更改。
发生的情况是,当发生摘要时,将RandomColorClass()调用您的函数并返回一个不同的值。这会触发一个额外的摘要,在该摘要中RandomColorClass()再次返回一个不同的值,从而触发另一个摘要…
你能看到这是怎么回事吗?您不应该以这种方式生成随机值-而是在您的范围内生成它们并将其持久化。
一种方法可能是在您的范围内:
function randomColourClass() { /* ... */ };$scope.GridStockRecords.forEach(function(record) { record.colorClass = randomColourClass(); });
和HTML:
<div ng-repeat='stockRecord in GridStockRecords | filter:searchText' ng-class='stockRecord.colorClass'> <div><h6>{{stockRecord.ProductGroupName}}</h6> </div> </div>解决方法
我正在尝试使用Angular创建MetroTile类型的网格,以实现这一目标,我希望每个瓷砖都具有不同的颜色。因此,我的行动计划是创建一个函数,该函数将在循环内随机选择一种颜色(使用ng-repeat)。这是我到目前为止所拥有的…
<div class={{RandomColourClass()}} ng-repeat='stockRecord in GridStockRecords | filter:searchText'> <div > <h6>{{stockRecord.ProductGroupName}}</h6> </div></div>
如您所见,我正在使用名为RandomColourClass的函数设置类名称,这是JS位
$scope.TileColours = [{colour:’thumbnail tile tile-blue’},{colour:’thumbnail tile tile-green’},{colour:’thumbnail tile tile-red’}];$scope.RandomColourClass = function(){ var randomColour = $scope.TileColours[Math.floor(Math.random() * $scope.TileColours.length)]; return randomColour.colour.toString();};
这一切工作正常,并且图块具有不同的颜色,但我一直收到以下错误
错误:达到10个$ digest()迭代。堕胎!”。
我看过有关此问题的其他帖子,但我不知道要使其正常工作需要进行哪些更改!?任何帮助或指示将不胜感激:)