Ionic 2 - 动态填充段

Question

我有类别和菜肴。每道菜都属于一个特定的类别。

我正在发出一个 http 请求以返回属于特定类型类别的所有菜肴。所以我得到了一个带有

的数组

{
  Soup[{'Name','Description', 'Price'..}, ..], 
  Chicken[{'Name','Description',..}], ...
}

其中包含所有汤，同样我将所有鸡放在一个数组中。现在，我使用以下方法为每个类别动态创建了细分：

<ion-segment [(ngModel)]="relationship" color="primary">
    <ion-segment-button  *ngFor ="let category of categories" value="{{category.Name}}">
  {{category.Name}} ({{category.Listings}})
    </ion-segment-button> 
</ion-segment>

现在我正在努力解决的部分是如何根据类别类型填充这些细分。所以汤段将有所有的汤。鸡段将包含所有鸡等。

到目前为止我所拥有的是：

<div [ngSwitch]="relationship" *ngFor = "let category of categories"> 
  <ion-list *ngSwitchCase="category.Name" ngSelected="selected">
    <ion-item *ngFor = "let dish of Dishes">
      <h2> {{dish.Name}}</h2>
    </ion-item>
  </ion-list>
</div>

我想要做的是以某种方式遍历 Dishes 数组的类别，并获取属于该特定类别的每个 dish.Name。

现在我已将 Dishes 定义为 data.data.Soup，因此所有段都只填充了汤。

Answer 1

感谢加布里埃尔先生的评论，我意识到我完全走错了路！我返回并将属于特定类别的所有菜肴嵌套在同一个数组中，并通过以下方式访问它们：

    <div  [ngSwitch]="relationship" *ngFor = "let category of categories">

    <ion-list *ngSwitchCase="category.Name" ngSelected="selected">

    <ion-item *ngFor = "let dish of category.Dishes">
    <h2> {{dish.Name}}</h2>
  </ion-item>
   </ion-list>
   </div>