Question

我正在尝试将article.html文件的数组放入单独的“ mat-tab”中。我想使用* ngFor以便我可以循环浏览文章对象数组（带有标签名，以及指向内容的html文件的链接），但我不知道如何正确链接html文件。

我尝试使用HTML导入-链接rel =“ import” href =“ myfile.html”，但是我不确定如何放置和循环实际内容（Chrome告诉我HTML导入是已取消使用-https://www.chromestatus.com/features/5144752345317376）。

在component.html中：

    <mat-tab-group>
      <mat-tab *ngFor="let x of articles" label={{x.name}}>
        <ng-template matTabContent>
            <x.content>
        </ng-template>
      </mat-tab>
    </mat-tab-group>

来自component.ts中的数组：

    articles = [
        {
          content: "./path/to/article1.html",
          name: "Article 1"

        },
        {
          content: "./path/to/article2.html",
          name: "Article 2"
        }, etc. ]

最终，我想要一个mat选项卡组件（类似于本示例https://material.angular.io/components/tabs/examples），该组件使用.html文件作为选项卡的内容。但是我当前的解决方案是不使用* ngFor并手动输入标签名称和html文章，这非常耗时。

谢谢：）

编辑：最后，我放弃了材料标签的想法，而是使用子路线实现了相同的效果。

此视频游戏提供了我需要的所有信息-https://www.youtube.com/watch?v=QpDSfl0Rbvc

如何在mat-tab-group的内容中放置多个HTML文件？

0 个答案: