gpt4 book ai didi

javascript - 在 Angular 中动态加载组件

转载 作者:行者123 更新时间:2023-11-30 19:01:10 24 4
gpt4 key购买 nike

<分区>

我收到所有要在特定时间显示的组件,因此我正在对其进行迭代。我已经尝试过如下所示。我已经创建了组件,只是允许使用来自服务器的组件

      <ngb-tabset [activeId]="1">
<ngb-tab id="{{i+1}}" title="{{dir.Name}}" *ngFor="let dir of DefaultDirectives;let i=index">
<ng-template ngbTabContent>
//Custom Component According to name of directive name in iteration
</ng-template>
</ngb-tab>
</ngb-tabset>

我有这样的例子:

 DefaultDirectives:any[]=[
{Name:'First Directive',Directive:'app-dir1'},
{Name:'Third Directive',Directive:'app-dir3'},
]

我有所有这些组件

@Component({
selector: 'app-dir1',
templateUrl: './dir1.component.html',
})
export class Dir1Component {
//Some Code
}



@Component({
selector: 'app-dir2',
templateUrl: './dir2.component.html',
})
export class Dir2Component {
//Some Code
}



@Component({
selector: 'app-dir3',
templateUrl: './dir3.component.html',
})
export class Dir3Component {
//Some Code
}

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com