使用ng2-bootstrap选项卡创建动态选项卡

Question

我正在尝试使用ng2-bootstrap标签组件来生成动态标签。

我希望Component作为标签的内容生成器。

是否有人尝试开发此用例？。所有ng2-bootstrap中的示例都指向静态内容

我很难将Component链接到Tab指令

Answer 1

如果我正确理解了您的问题，这段代码基本上可以满足您的要求：

let pages = [
  {
  "title" = "Page 1",
  "data" = {
    whatever data you have ...
  },
  {
  "title" = "Page 2",
  "data" = {
    whatever data you have ...
  },
  {
  "title" = "Page 3",
  "data" = {
    whatever data you have ...
  }
]

然后您可以创建内容

<tabset *ngIf="pages.length > 0">
  <tab *ngFor="let page of pages" heading="{{ page.title }}" class='tab'>
    DO WHATEVER YOU WANT TO DO WITH YOUR

    page.data

    IN HERE
  </tab>
</tabset>