离子编程选项卡种群

Question

我正在尝试为菜单的每个部分创建一个选项卡。

所以我有以下数据结构：

[
  { name: 'Wines', contents:[...] },
  { name: 'Ciders', contents: [...] },
  { name: 'Beers', contents:[...] }
]

我想要的是某种ngfor，它将为上方数组中的每个元素产生一个选项卡。

我没有在网上看到任何东西，似乎无法自己解决。

有人有任何经验吗？

Answer 1

尝试这样的东西：

let tabs = [{name:'Wines', contents:[...]},
 {name:'Ciders', contents: [...]},
 {name:'Beers', contents:[...]}
];
<ion-tabs>
  <ion-tab *ngFor="let tab of tabs" [root]="tab.name"></ion-tab>
</ion-tabs>

如果tab.name是具有@IonicPage装饰器的页面，则该类别名称等于您的Tab对象的name属性。示例：

@IonicPage()
@Component({
  ...
})
export class MyPage {
}

然后tab.name必须为 mypage 。

请注意，将字符串设置为选项卡的根，利用懒惰加载来设置标签的根页。因此，如果您不熟悉离子团队，则可能应该阅读以下文章：

• 第1部分
• 第2部分