bug(Tabs): Nested tabs with custom mat-tab-label template is wrongly applied to parent tab too

[bjdash]

Reproduction

Use StackBlitz to reproduce your issue:
https://stackblitz.com/edit/angular-ra4b9y?file=src/app/tab-group-custom-label-example.html

Steps to reproduce:

1. Run the stackblitz example and notice the parent tab now has label of the first child tab instead of its own label

Expected Behavior

The parent tab-group is using the default <mat-tab label="Parent 1"> to set its label. The child tab-group is using <ng-template mat-tab-label>Child 1</ng-template> . The ideal behavior in this situation would be for the first tab of the parent group to have a label of Parent 1

Actual Behavior

The first tab of the parent group is wrongly taking the label of its child tab group

Environment

• Angular: 12
• CDK/Material: 12
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[angular-automatic-lock-bot]

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.}