如何在ng-repeat中传递动态范围值

Question

在此我创建了嵌套的ng-repeat.Now，我需要将第一个ng-repeat id值传递给内部ng-repeat 。 我如何在内部ng-repeat传递该val.id

我的桌子

<table>
<tr ng-repeat="val in sample">
<td>
<table>
    <tr>
        <td>{{val.id}}</td>
        <td>{{val.name}}</td>
     </tr>
         <tr ng-repeat="new_val in new_sample{{val.id}}">
         <td>
             <table>
                 <tr>
                     <td>{{new_val .new_id}}</td>
                     <td>{{new_val .new_name}}</td>
                 </tr>
              </table>
         </td>
         </tr>
</table>
</td>
</tr>
</table>

我的剧本

var myApp = angular.module("myApp", []);
myApp.controller("MyController", function MyController($scope){ 
    $scope.sample = [
        {'id' : '1','name' : 'jon'},
        {'id' : '2','name' : 'albert'}
    ];

    $scope.new_sample1 = [
        {'id' : '11','name' : 'jon1'},
        {'id' : '22','name' : 'albert1'}
    ];

    $scope.new_sample2 = [
        {'id' : '111','name' : 'jon2'},
        {'id' : '222','name' : 'albert2'}
    ];
});

Answer 1

您可以通过在ng-repeat元素中使用ng-init来实现。 在这种情况下，您的HTML将是

<table ng-app="myApp" ng-controller="MyController">
<tr ng-repeat="val in sample" ng-init="subVal=new_sample[val.id]">
<td>
<table>
    <tr>
        <td>{{val.id}}</td>
        <td>{{val.name}}</td>

     </tr>
         <tr ng-repeat="new_val in subVal">
         <td>
             <table>
                 <tr>
                     <td>{{new_val.id}}</td>
                     <td>{{new_val.name}}</td>
                 </tr>
              </table>
         </td>
         </tr>
</table>
</td>
</tr>
</table>

在脚本中。

var myApp = angular.module("myApp", []);
    myApp.controller("MyController", function MyController($scope){ 
     $scope.sample = [
     {'id' : '1','name' : 'jon'},
     {'id' : '2','name' : 'albert'}
     ]

     $scope.new_sample = {
         1 : [  
                 {'id' : '11','name' : 'jon1'},
                 {'id' : '22','name' : 'albert1'}
             ],
         2 : [
                 {'id' : '111','name' : 'jon2'},
                 {'id' : '222','name' : 'albert2'}
         ]

    }

     });

但是请注意，您需要如上所述更改new_sample对象。 正常工作的Feedel在这里

Answer 2

您ng-repeat div应该通过其索引访问数组，这可能对标记本身可行。

标记

<tr ng-repeat="new_val in ['new_sample'+ val.id]">

Answer 3

您不能使用{{}}访问ng-repeat中的对象名称。 您需要更改对象的结构才能动态访问它们。

几乎没有改变。

 var myApp = angular.module("myApp", []);
 myApp.controller("MyController", function MyController($scope){ 
      $scope.sample = [
           {'id' : '1','name' : 'jon'},
           {'id' : '2','name' : 'albert'}
      ]

      $scope.innerSample = {
           "new_sample1" : [
                {'id' : '11','name' : 'jon1'},
                {'id' : '22','name' : 'albert1'}
           ],
           "new_sample2" : [
                {'id' : '111','name' : 'jon2'},
                {'id' : '222','name' : 'albert2'}
           ]  
      };
 });

HTML文件

 <table>
      <tr ng-repeat="val in sample">
           <td>
                <table>
                    <tr>
                        <td>{{val.id}}</td>
                        <td>{{val.name}}</td>
                     </tr>
                          <tr ng-repeat="new_val in innerSample[newSample{{val.id}}]">
                              <td>
                                  <table>
                                      <tr>
                                          <td>{{new_val .new_id}}</td>
                                          <td>{{new_val .new_name}}</td>
                                      </tr>
                                   </table>
                              </td>
                         </tr>
                </table>
           </td>
      </tr>
 </table>