Question

我需要帮助才能在表格中显示这个json ...问题是在这种情况下不能使用ng-repeat。

    {
"dows": [
    {
        "dow": 1,
        "times": [
            {
                "open": "09:00:00",
                "close": "12:00:00",
            },
            {
                "open": "14:00:00",
                "close": "16:30:00",
            }
        ]
    },
    {
        "dow": 2,
        "times": [
            {
                "open": "09:00:00",
                "close": "12:30:00",
            },
            {
                "open": "14:00:00",
                "close": "19:45:00",
            }
        ]
    }
    .
    .
    .
}

每个dow代表html中的<td>，而times数组中的每个元素都是dow中的<tr>。

这就是我想要的样子 https://i.stack.imgur.com/Zcado.jpg

Answer 1

回答可能为时已晚，但如果你还没有解决问题，

然后this fiddle可以帮助你。

<tr ng-repeat="dow in dowArr track by dow.dow">

如果您想了解更多关于ng-repeat的信息，

请参阅以下链接。

Angularjs的官方文件 - ngRepeat

https://docs.angularjs.org/api/ng/directive/ngRepeat

w3cschools.com的文件 - ngRepeat

https://www.w3schools.com/angular/ng_ng-repeat.asp

Answer 2

根据您使用的Angular，您可以先将此数据推送到组件中的数组中......

仅基于您提供的代码段...

类似的东西：

var hello = []; //or hello: Array<any> = []; etc...
for(let h in dow.dows){
    hello.push(dow.dows[h])
}

全局存储变量。这样，你可以使用

<div *ngFor="let dow of hello">
  <h2>{{dow.dow}}</h2>
  <ng-container *ngFor="let time of dow.times">
    <p>Time Open: {{time.open}}</p>
    <p>Time Close: {{time.close}}</p>
  </ng-container>
</div>

同样，我只是根据所提供的信息而不知道你正在使用哪个角度......

但希望这在某种程度上会有所帮助。

如何在表中显示这个json

2 个答案: