Question

我正在尝试使用angular.js处理一些嵌套重复，并且似乎无法使其工作。我像我这样构建了我的json -

[
 {
"levels": [
  {
    "targets": [
      "one", 
      "two", 
      "three", 
      "four"
    ], 
    "response": "response", 
    "instructions": "insturctions"
  }
  ], 
"name": "Name One", 
"form": [
  {
    "pfade": "fade", 
    "ptype": " type", 
    "psection": "section", 
    "lbehavior": "l behave", 
    "options": "options", 
    "tbehaviour": "t behave"
  }
]
}, 
{
"levels": [
  {
    "targets": [
      "one", 
      "two", 
      "three", 
      "four"
    ], 
    "response": "response", 
    "instructions": "insturctions"
  }
], 
"name": "Name Two", 
"form": [
  {
    "pfade": "fade", 
    "ptype": " type", 
    "psection": "section", 
    "lbehavior": "l behave", 
    "options": "options", 
    "tbehaviour": "t behave"
  }
]
}, 
{
"levels": [
  {
    "targets": [
      "one", 
      "two", 
      "three", 
      "four"
    ], 
    "response": "response", 
    "instructions": "insturctions"
  }
], 
"name": "Name Three", 
"form": [
  {
    "pfade": "fade", 
    "ptype": " type", 
    "psection": "section", 
    "lbehavior": "l behave", 
    "options": "options", 
    "tbehaviour": "t behave"
  }
]
}
]

如果您愿意，还可以在此处链接：http://www.json-generator.com/api/json/get/bOyGmHavfS?indent=2

我试图在重复中循环遍历子数组，而我似乎无法（正确地参考？）正确地对它们进行循环。我发现了一些嵌套的ng-repeats的其他例子，他们似乎没有问题这样做，所以这里我刺了它

<!--  parent level repeats -->
                        <tr class="saLevel" ng-repeat="parent in listTable track by $index">

                            <td></td><td><input type="checkbox" name="instructionLevelChecker" ng-model="levelRadio" ></td><td>{{parent.name}}</td><td></td><td></td><td></td>


                                <!--  sub level repeats -->

                                <span ng-repeat="sub in parent.levels">{{sub}}sub</span>

                                <!--  end sub level repeat -->
                        </tr>
                    <!--  end parent levels -->

我知道跨度很讨厌 - 我只是想在造型之前让它工作。它似乎不喜欢这个论点，我无法弄清楚其中的原因。

另外 - 在另一部分我试图从子数组（形式一）中提取信息，这也似乎无法开始工作。我假设它有同样的问题。所以我正在做

    <div class="subformWrappers" ng-repeat="level in levels track by $index">

然后在内部，我试图在＆＃34;表格中提取数据＆＃34;通过这样做：

    <textarea rows="4" ng-model="level.form.options"></textarea>

同样没有成功，我假设这两个问题都与同一个问题有关。任何输入都会非常有用!!谢谢你的阅读。

Answer 1

这是使用嵌套重复的简单示例。希望这可以帮助你。

Json模型

 $rootScope.list = [{
        "levels" : [{
                "targets" : [
                    "one",
                    "two",
                    "three",
                    "four"
                ],
                "response" : "response",
                "instructions" : "insturctions"
            }
        ],
        "name" : "Name One",
        "form" : [{
                "pfade" : "fade",
                "ptype" : " type",
                "psection" : "section",
                "lbehavior" : "l behave",
                "options" : "options",
                "tbehaviour" : "t behave"
            }
        ]
    },
    .
    .
    .
    ];

一些嵌套重复样本，您可以根据需要进行更改。

  <div data-ng-repeat="item in list">
    <div>{{item.name}} <input type="text" ng-model="item.form[0].options"/></div>
    <ul data-ng-repeat="level in item.levels">
      <li data-ng-repeat="target in level.targets">{{target}}</li>
    </ul>
    <hr/>
  </div>

Plunker http://plnkr.co/edit/E2frec2QHBdOMksaZQj2

嵌套的ng-repeats在角度

1 个答案: