返回增量ng重复ng重复功能angularJS

时间:2017-09-27 18:20:33

标签: javascript angularjs multidimensional-array angularjs-ng-repeat

我在另一个ng-repeat中有一个ng-repeat,我需要能够记录所有记录的全局计数。

我尝试在ng-repeat中的视图中声明一个变量,这样它就会增加并且不起作用。

我目前有以下代码。

<body ng-app="app">
  <div class="table-responsive" ng-controller="quotesController">
    <div ng-repeat="info in datos2 track by $index">
      <h2><strong>{{info.name}}</strong></h2>
      <div ng-init='count()' ng-repeat="dato in data track by $index">
        <span>{{dato.name}}</span>
        <br> Position {{id}}
        <br />
      </div>
    </div>
  </div>
</body>

Code Angular

$scope.count=function(){
    number = number + 1; 
    $scope.id=number;  
}

我需要每个ng-repeat查询来为我提供数字位置。

  

示例:

     

姓名1项目1 - 职位1

     

项目2 - 职位2

     

姓名2项目1职位3

     

第2项 - 第4项

     

姓名3项目1 - 职位5

     

项目2 - 职位6

http://plnkr.co/edit/I5IWOXGmzbu0UNqn04ha?p=preview

3 个答案:

答案 0 :(得分:1)

你应该能够使用ngInit。

<body ng-app="app">
  <div class="table-responsive" ng-controller="quotesController" ng-init="totalCount = 1">
    <div ng-repeat="info in datos2 track by $index">
      <h2><strong>{{info.name}}</strong></h2>
      <div ng-repeat="dato in data track by $index" ng-init="position = totalCount++">
        <span>{{dato.name}}</span>
        <br> Position {{position}}
        <br />
      </div>
    </div>
  </div>
</body>

答案 1 :(得分:1)

您可以从控制器返回一个全局计数器,并将其分配给嵌套ngInit的每个ngRepeat的范围变量,如:

// Code goes here
angular.module('app', [])
.controller('quotesController',
  function quotesController($scope) {
    $scope.datos2 = [{
        "name": "Name 1",
      }, {
        "name": "Name 2",
      }, {
        "name": "Name 3",
      }
    ];

    $scope.data = [{
        "name": "ITEM 1",
      }, {
        "name": "ITEM 2",
    }]; 

    var number = 1;
    $scope.count = function(){
        return number++; 
    }

});
<body ng-app="app">
  <div class="table-responsive" ng-controller="quotesController">
    
    <div ng-repeat="info in datos2 track by $index">
      <h2><strong>{{info.name}}</strong></h2>
      <div ng-init='id = count()' ng-repeat="dato in data track by $index">
        <span>{{dato.name}}</span>
        <br> Position {{id}}
        <br />
        <br>
      </div>

    </div>
  </div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>

答案 2 :(得分:0)

您可以使用{{($parent.$index*data.length)+($index+1)}}

<div ng-repeat="info in datos2 track by $index">
  <h2><strong>{{info.name}}</strong></h2>
  <div ng-init='count()' ng-repeat="dato in data track by $index">
     <span>{{dato.name}}</span>
     <br> Position {{($parent.$index*data.length)+($index+1)}}
     <br />
     <br>
  </div>
</div>

http://plnkr.co/edit/0mcgZfxmL5PBwSDp0hoo?p=preview