如何使一个 ng-repeat 在不同行中的不同列上工作答案

【问题标题】：how to make one ng-repeat to work on different columns in different rows如何使一个 ng-repeat 在不同行中的不同列上工作
【发布时间】：2017-09-24 11:00:32
【问题描述】：

我正在尝试使用 angular 显示像这样制定的数据

"a":[{
    "name": "a's name"
    "b":[{
        "name":"b's name"
        "c":[{
            "name": "c's name"
            "d":[{
                "name":"d's name"
            }]
        }]
    }]
}]

我试过了，但是没用

tr
    td(ng-repeat="oneB in a.b")
    | {{oneB.name}}
tr
    td(ng-repeat="oneC in oneB.c")
    | {{oneC.name}}
tr
    td(ng-repeat="oneD in oneC.d")
    | {{oneD.name}}

还有这个

tr
    td(ng-repeat-start="oneB in a.b")
    | {{oneB.name}}
tr
    td(ng-repeat-end,ng-repeat-start="oneC in oneB.c")
    | {{oneC.name}}
tr
    td(ng-repeat-end,ng-repeat="oneD in oneC.d")
    | {{oneD.name}}

我真的需要帮助。

我目前正在开发 MEAN 堆栈（Mongodb Express.js Angular.js 和 Node.js）以及 PUG

desired Image

JSON Image

【问题讨论】：

我认为您的 json 结构不是最适合您目标的结构。你想要的输出是什么？
如果您在平均堆栈中开发并且您可以控制服务调整您的 json 对象以匹配更简单的结构
@firegloves 我添加了所需的输出。名称：“所需图像”
很难判断您显示的 JSON 结构与您尝试在“所需图像”中显示的表结构之间的关系。也不清楚“它不能工作”到底是什么意思。在我看来，这些数据的组织方式并不能使您期望合理地完成输出。
你能告诉我关于 JSON 结构的建议吗？谢谢

标签： html angularjs pug

【解决方案1】：

希望对你有帮助

var app = angular.module('App', []);

app.controller('Ctrl', function($scope) {

  $scope.data = [{
    "name": "a's name",
    "b":[{
        "name":"b's name",
        "c":[{
            "name": "c's name",
            "d":[{
                "name":"d's name"
            }]
        }]
    }]
}];
  
});

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


<div ng-app="App">
  <div ng-controller="Ctrl">
  
  <pre>{{data | json}}</pre>
  
    <div ng-repeat="a in data"> 
      {{ a.name }}
      <div ng-repeat="b in a.b">
        {{ b.name }}
        <div ng-repeat="c in b.c">
          {{ c.name }}
          <div ng-repeat="d in c.d">
            {{ d.name }}
          </div> 
        </div> 
      </div>       
    </div>
    
    
  </div>
</div>

【讨论】：

它可以工作，但不会给我想要的输出。