Closed mibeon closed 3 years ago
From the tabs placement docs:
Caution Avoid nesting a tab within another tab.
Here's a working StackBlitz demo of this issue. It shows that both the color
and backgroundColor
Inputs are inherited.
This demo shows that this is still the behavior when using the MDC-based tabs.
This happens, because our selectors are too broad and it's unintentional. It should be resolved by #21533.
This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.
Bug Report
Hey guys, I'm going crazy with this buggy feature of angular material. If you want to use a nested mat-tab-group inside of a mat-tab-group, which has background color of primary, all your child tab-groups gets the same background color. WHY the hell it happens???
Demo and steps to reproduce the issue
Take this example https://stackblitz.com/angular/oorxxxlyavb?file=src%2Fapp%2Ftab-group-basic-example.html or any other it doesn't matter.
Add or replace the content with that
AND SEE
The nested tab group should provide the default behavior, without background and colorized underline, because there is no property "backgroundColor", BUT IT DOESN'T. Instead it gets the same background color like it's parent.
We need either a fix for that unexpected behavior or a possibility to explicit unset the backgroundColor property.
Angular versions