Angularjs 分为ng重复，用于随机迭代次数

我需要创建一个包含分隔符的

ng repeat

迭代。问题是，我必须在每两个、三个或四个元素之后随机添加分隔符。我从以下代码开始：

<li repeat-start="person in persons track by $index">
  <p>{{ person.name }}</p>
</li>

<li ng-repeat-end ng-if="($index + 1) % 2 === 0">
  <p>--divider--</p>
</li>

但当我试图改变硬编码值时，我看不到理想的结果。这些解决方案都不起作用。不需要简单的函数调用

ng-if="($index + 1) % getNumber() === 0"

也不使用

ng init

变体

<li repeat-start="person in persons track by $index" ng-init="coeff = getNumber()">
  <p>{{ person.name }}</p>
</li>

<li ng-repeat-end ng-if="($index + 1) % coeff === 0">
  <p>--divider--</p>
</li>

{{person.name}



--分隔器--

如何实现此功能？

尝试以下方法（一些重构）：

{{person.name}

——分隔符--

$scope.putDividerHere（索引）{
var randomNumber=Math.floor（Math.random（）*（3）+2）；
返回（（索引+1）%randomNumber）==0；
}

试试这个（一些重构）：

{{person.name}

——分隔符--

$scope.putDividerHere（索引）{
var randomNumber=Math.floor（Math.random（）*（3）+2）；
返回（（索引+1）%randomNumber）==0；
}

需要一点小改动。在

ng if

中调用一个函数，该函数调用

getNumber

函数并返回条件true/false

HTML:

编辑所达到的

迭代次数。正在中止

错误

<li ng-repeat="person in persons track by $index">
  <p>{{person.name}}</p>
  <p ng-if="isShowDivider($index+1)">--divider--</p>
</li>

{{person.name}

——除法器--

需要一点小改动。在

ng if

中调用一个函数，该函数调用

getNumber

函数并返回条件true/false

HTML:

编辑所达到的

迭代次数。正在中止

错误

<li ng-repeat="person in persons track by $index">
  <p>{{person.name}}</p>
  <p ng-if="isShowDivider($index+1)">--divider--</p>
</li>

{{person.name}

——除法器--

问题在于无限$digest循环，这是由以下事实造成的：

getNumber

函数返回随机结果，因此AngularJS无法稳定自身。要为每个

ng repeat

迭代只计算

getNumber

一次，您可以使用

ng init

指令，就像您已经做的那样（可能是您的代码由于输入错误而无法工作：

repeat start

而不是

ng repeat start

）：

angular.module（'app'，[]）.controller（'ctrl'，['$scope'，function（$scope）{
$scope.persons=[]；
对于（变量i=0；i<20；i++）
$scope.Person.push（{name:'Person'+i}）；
$scope.getNumber=函数（）{
返回Math.floor（Math.random（）*3+2）；
}
}])

{{person.name}



--分隔器--

问题在于无限$digest循环，这是由以下事实造成的：

getNumber

函数返回随机结果，因此AngularJS无法稳定自身。要为每个

ng repeat

迭代只计算

getNumber

一次，您可以使用

ng init

指令，就像您已经做的那样（可能是您的代码由于输入错误而无法工作：

repeat start

而不是

ng repeat start

）：

angular.module（'app'，[]）.controller（'ctrl'，['$scope'，function（$scope）{
$scope.persons=[]；
对于（变量i=0；i<20；i++）
$scope.Person.push（{name:'Person'+i}）；
$scope.getNumber=函数（）{
返回Math.floor（Math.random（）*3+2）；
}
}])

{{person.name}



--分隔器--

我总是收到错误“达到迭代次数。中止！在过去5次迭代中触发的观察者：[[{“msg”：“IsShowDifferer（$index+1）”，“newVal”：true，“oldVal”：false}”同样的问题仍然存在。也许这是我的应用程序中的特定问题。我总是收到错误“达到迭代次数。中止！在过去5次迭代中触发的观察者：[[{“msg”：isShowDivider（$index+1）”，“newVal”：true，“oldVal”：false}“同样的问题仍然存在。也许这是我的应用程序中的特定内容。这是从数组中获取随机值的完美答案…在ng重复中不会出错…这是从数组中获取随机值的完美答案…在ng重复中不会出错。。。

<li ng-repeat-end ng-if="isShowDivider($index+1)">
  <p>--divider--</p>
</li>

$scope.isShowDivider = function (index) {
  if (index % $scope.getNumber() !== 0) 
     return false;
  return true;
}

$scope.getNumber = function() {
  return Math.floor(Math.random() * (3) + 2);
}

<li ng-repeat="person in persons track by $index">
  <p>{{person.name}}</p>
  <p ng-if="isShowDivider($index+1)">--divider--</p>
</li>