Question

我在ng-tabset使用* ngFor。但这样做根本不会绘制标签。 do ng-tabs需要在module.ts文件中调用任何依赖项

          <ngb-tabset>
            <ng-tab *ngFor="let item of [1,2,3]" title="{{item}}">
                <ng-template ngbTabContent> {{item}}</ng-template>
            </ng-tab>



        </ngb-tabset>

当我静态命名时，它确实有效，如示例

所示

 <ngb-tabset>
        <ngb-tab title="Simple">
          <ng-template ngbTabContent>
            <p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth
            master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh
            dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum
            iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.</p>
          </ng-template>
        </ngb-tab>
        <ng-tab *ngFor="let item of items" title=" {{item}}">
            <ng-template ngbTabContent> {{item}}</ng-template>
  </ng-tab>

Answer 1

据我所知，您指的是每个Tab

的单个模板

ngTemplateOutlet

您可以尝试使用<ngb-tabset> <ng-tab *ngFor="let tab of tabs" title="{{tab.title}}"> <ng-container [ngTemplateOutlet]='tab.content'></ng-container> </ng-tab> </ngb-tabset>在每个标签

中呈现多个模板

{{1}}

如何使用ng-Bootstrap在Angular中使用* ngFor动态创建选项卡

1 个答案: