如何在标签内容中以角度加载HTML模板

我有一个Angular 8应用。

在下面的文章之后,我对ContentChildernQueryList等有了一个了解,并构建了一个示例标签组件。

https://juristr.com/blog/2016/02/learning-ng2-creating-tab-component/

这是我带有标签的应用程序组件的样子

//our root app component
import { Component,ViewChild } from '@angular/core';
import { TabsComponent } from './tabs/tabs.component';

@Component({
 selector: 'my-app',template: `
 <my-tabs>
  <my-tab [tabTitle]="'Tab 1'">
    Tab 1 content
  </my-tab>
  <my-tab tabTitle="Tab 2">
    Tab 2 content
  </my-tab>
</my-tabs>
`
})
export class AppComponent { }

但是我有很长的HTML模板,因为每个选项卡的内容都是一个简单的字符串。

如何针对每个标签指向HTML模板作为标签内容?如下所示

 <my-tab [tabTitle]="'Tab 1'">
    //templateUrl -> tab1.content.html
  </my-tab>

谢谢!

dzc361 回答:如何在标签内容中以角度加载HTML模板

像这样:

 <nav mat-tab-nav-bar color="accent" backgroundColor="accent">
<a
  mat-tab-link
  routerLinkActive="active"
  [routerLinkActiveOptions]="{ exact: true }"
  [routerLink]="['/customers/update',id]"
>
  Info
</a>
<a
  mat-tab-link
  routerLinkActive="active"
  [routerLink]="['/customers/update',id,'contacts']"
>
  Contacts
</a>
<a
  mat-tab-link
  routerLinkActive="active"
  [routerLink]="['/customers/update','locations']"
>
  Locations
</a>
</nav>
<div>
  <router-outlet></router-outlet>
</div>

然后将组件加载到路由器中

本文链接:https://www.f2er.com/3166561.html

大家都在问