Fatal编程技术网
  • javascript/
  • Javascript AngularJS嵌套ng使用单个索引重复？

Javascript AngularJS嵌套ng使用单个索引重复？

javascript angularjs

Javascript AngularJS嵌套ng使用单个索引重复？,javascript,angularjs,Javascript,Angularjs,使用Angular 1.0.7，如何为嵌套的ng repeats指定单个索引，以便内部数组上的每个项都获得一个连续的索引值？（即所有内部数组中的所有元素的0、1、2、3等） 要说明： <ul> <li ng:repeat="item in arr1"> <ul> <li ng:repeat="child in item.children">{{consecutiveIndex++}}</li&g

使用Angular 1.0.7，如何为嵌套的
ng repeat
s指定单个索引，以便内部数组上的每个项都获得一个连续的索引值？（即所有内部数组中的所有元素的0、1、2、3等）

要说明：

<ul>
    <li ng:repeat="item in arr1">
        <ul>
            <li ng:repeat="child in item.children">{{consecutiveIndex++}}</li>
        </ul>
    </li>
</ul>
HTML:

    

  • 

      

    • {{index（）}
      • 

    

    •
我用这个得到了非常奇异的AngularJS错误（相信我，你不想知道）

我还发现（在控制台输出之后），即使对于只有4个元素的数组，ng repeat对我的
cindex（）
函数的命中次数也超过了80次。意思不是0、1、2和3，而是84、85、86和87

有什么想法吗？

提供了一个特殊的
$index
属性，它应该适合您的需要。它是基于零的，并且在每个模板实例的本地范围中公开

试试这个：

<ul>
    <li ng:repeat="item in arr1">
        <ul>
            <li ng:repeat="child in item.children">{{$index + 1}}</li>
        </ul>
    </li>
</ul>

    

  • 

      

    • {{{$index+1}
      • 

    

    •
提供了一个特殊的
$index
属性，该属性应适合您的需要。它是基于零的，并且在每个模板实例的本地范围中公开

试试这个：

<ul>
    <li ng:repeat="item in arr1">
        <ul>
            <li ng:repeat="child in item.children">{{$index + 1}}</li>
        </ul>
    </li>
</ul>

    

  • 

      

    • {{{$index+1}
      • 

    

    •
你不能依赖于你的
{{index（）}
被调用的次数是固定的。每当angular决定脏检一个作用域时，它将运行所有绑定

您可以基于其他索引生成值

HTML

<body ng:controller="MainCtrl">
  <ul>
     <li ng:repeat="item in arr1">
        <ul ng:init="parentIndex = $index">
           <li ng:repeat="child in item.children">{{getConsecutiveIndex(parentIndex, $index)}}</li>
        </ul>
     </li>
  </ul>
</body>



    

  • 

      

    • {{getconsutiveindex（parentIndex，$index）}
      • 

    

    •
JS

app.controller('MainCtrl', function($scope) {
  $scope.arr1 = [{children:[0,1,2,3]}, {children:[4,5]}, {children:[6,7,8]}];

  $scope.getConsecutiveIndex = function(parentIndex, $index) {
    var total = 0;
    for(var i = 0; i < parentIndex; i += 1) {
      total += $scope.arr1[i].children.length;
    }
    return total + $index;
  }
});

app.controller（'MainCtrl'，函数（$scope）{
$scope.arr1=[{children:[0,1,2,3]}，{children:[4,5]}，{children:[6,7,8]}]；
$scope.getConcertiveIndex=函数（parentIndex，$index）{
var合计=0；
对于（变量i=0；i
你不能依赖于你的
{{index（）}
被调用的次数是固定的。每当angular决定脏检一个作用域时，它将运行所有绑定

您可以基于其他索引生成值

HTML

<body ng:controller="MainCtrl">
  <ul>
     <li ng:repeat="item in arr1">
        <ul ng:init="parentIndex = $index">
           <li ng:repeat="child in item.children">{{getConsecutiveIndex(parentIndex, $index)}}</li>
        </ul>
     </li>
  </ul>
</body>



    

  • 

      

    • {{getconsutiveindex（parentIndex，$index）}
      • 

    

    •
JS

app.controller('MainCtrl', function($scope) {
  $scope.arr1 = [{children:[0,1,2,3]}, {children:[4,5]}, {children:[6,7,8]}];

  $scope.getConsecutiveIndex = function(parentIndex, $index) {
    var total = 0;
    for(var i = 0; i < parentIndex; i += 1) {
      total += $scope.arr1[i].children.length;
    }
    return total + $index;
  }
});

app.controller（'MainCtrl'，函数（$scope）{
$scope.arr1=[{children:[0,1,2,3]}，{children:[4,5]}，{children:[6,7,8]}]；
$scope.getConcertiveIndex=函数（parentIndex，$index）{
var合计=0；
对于（变量i=0；i
感谢您分享此信息。我有一个类似的需求，嵌套的ng重复，但需要知道我在外部$index的哪个迭代中。我能够将ng init移动到与外部ng repeat相同的标记。仅供参考。谢谢分享。我有一个类似的需求，嵌套的ng重复，但需要知道我在外部$index的哪个迭代中。我能够将ng init移动到与外部ng repeat相同的标记。仅供参考。