4

I have create a mat-tab that I reuse a lot in my different tab-groups.
Since I do not repeat code, I created a component mat-tab-foo.
It contains the following HTML:

 <mat-tab label="Foo">
   <p>Bar</p>
 </mat-tab>

I tried using it in my mat-tab-group like so:

 <mat-tab-group>
   <mat-tab-foo></mat-tab-foo>
 </mat-tab-group>

But the tab is never rendered, does anyone know how to render mat-tab-foo inside the mat-tab-group?

A Stackblitz example can be found here.

Hypenate
  • 1,907
  • 3
  • 22
  • 38

1 Answers1

1

I think that post can help you, look the second answer too:

Angular Material Tabs not working with wrapper component

Basically, you have to wrapper the mat-tab-group in another component and add the tabs in the .ts. It worked for me

Char Line
  • 11
  • 1