使用嵌套NG-Repeat的序列号

时间:2016-07-01 07:49:41

标签: angularjs

我想在每个问题中添加序列号

ng-repeat = "Table in Paper"
   Display table
ng-repeat = "question in question" 
   (1) Display question
   (2) Display question

我可以在Question中使用$ index。但对于每个表,它从1开始。

E.g。

  

表1

     

问题1

     

问题2

     

表2

     

问题1

     

问题2

但我想要

  

表1

     

问题1

     

问题2

     

表2

     

问题3

     

问题4

我使用$ parent& $指数。但是没有工作。

<div ng-repeat="section in Table">
 <div ng-repeat="question in section.question">
         <span >{{(Section[$parent.$index-1].question.length + $index + 1 )+
                                    '. ' +
                                    question
                                    .Description}}</span>

  </div>

3 个答案:

答案 0 :(得分:1)

试试这个。

var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl', ["$scope",function MyCtrl($scope) {
  $scope.lastIndex = 0;
  $scope.lastIndexes = [];
  $scope.Table ={
                  "table1":
                     {
                      "question":["questionA","questionB","questionC","questionD"]
                     },
                    "table2":
                     {
                      "question":["questionA","questionB","questionC","questionD"]
                     },
                    "table3":
                      {
                        "question":["questionC","questionD","questionF"]
                      },
                    "table4":
                      {
                        "question":["questionC","questionD","questionE"]
                      }
                   };
  
  $scope.setLastIndex = function(len){
      $scope.lastIndex = $scope.lastIndex + len*1;
      $scope.lastIndexes.push($scope.lastIndex);
    }

}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
   <div ng-repeat="(key,value) in Table"
        ng-init="setLastIndex(value.question.length)">
    {{key}}
 <div ng-repeat="question in value.question" >
         <span>{{($index+1 +lastIndexes[$parent.$index-1])}} :{{question}}</span>
  </div>

</div>

答案 1 :(得分:0)

使用

<div ng-repeat = "Table in Paper">
    <div ng-repeat="q in Table.questions">
        {{q}}
    </div>
</div>

这里的问题是数组并出现在你的json

答案 2 :(得分:0)

这可能不是我想要的完美解决方案,但它可以是一个临时解决方案,

在控制器中创建手表或功能以遍历所有问题

                var index=1;
                Section.forEach(function (section) {
                        section.question.forEach(function (question) {
                            question.Number= index;
                            index++;
                        })
                })

然后在ng-repeat

中打印此数字
<div ng-repeat="section in Table">
  <div ng-repeat="question in section.question">
     <span >{{question.Number +'. ' +question.Description}}</span>
   </div>
</div>