Question

我尝试使用ng-repeat值，group1，group2

我正在

GRP1

GRP2

ABC

DEF

值1

值2

我需要

GRP1

  abc

     valu1

GRP2

      def

          valu1  

Html:
<ul>
<li ng-repeat="heading in group1"> {{heading}} </li> // heading
<li ng-repeat="subheading in group2"> {{subheading }} </li> // sub heading
<li ng-repeat="val in value"> {{val}} </li> // value
</ul>



JavaScript:

                             $scope.group1 = [grp1,grp2];
                             $scope.group2 = [abc,def];
                             $scope.value = [value1,value2];

Answer 1

使用$ index获取其他子值

 <div ng-repeat="eachval in group1">
   <p>{{ eachval }}</p>
   <p style="margin-left:15px">{{ group2[$index]}}</p>
   <p style="margin-left:25px">{{ value[$index]}}</p>
 </div>

以下是WORKING FIDDLE

Answer 2

您应该使用具有三个不同键的单个数组

$scope.arrayList = [{group1Name : 'grp1',group2Name: 'abc', valueName: 'val1'},
{group1Name : 'grp2',group2Name: 'def', valueName: 'val2'}]

htlm看起来像这样

<li ng-repeat="group in arrayList">
    <div>{{group.group1Name}}</div>
    <div>{{group.group2Name}}</div>
    <div>{{group.valueName}}</div>
</li>

您可以编写一个简单的javascript来修改1个数组中的3个数组。希望这有帮助

Answer 3

使用ng-repeat起点和终点迭代第一个数组，然后使用$index引用其他元素：

<ul>
    <li ng-repeat-start="heading in group1">{{heading}}</li> // heading
    <li> {{group2[$index]}} </li> // sub heading
    <li ng-repeat-end> {{val[$index]}} </li> // value
</ul>

如何使用angularjs同时绑定3个数组

3 个答案: