This repository was archived by the owner on Sep 5, 2024. It is now read-only.
This repository was archived by the owner on Sep 5, 2024. It is now read-only.
md-tabs: the label/body syntax does not work when inside another md-tabs #4989
Closed
Description
I found an issue using md-tabs within md-tabs using a specific syntax. When I use this syntax it works fine:
<!-- Finances tab -->
<md-tab label="Finance" md-on-select="$root.updateTabUrl('finance')" ng-if="true || gamesShow.resource.can_manage">
<md-tabs md-no-bar md-stretch-tabs="always" class="inner-tabs">
<md-tab label="Subtab-1">content</md-tab>
<md-tab label="Subtab-2">more content</md-tab>
</md-tabs>
</md-tab>
But when I use the other syntax, so I can include icons in my inner tabs, it seems to add the inner tab to the parent tabs and replace the finance tab. This method was outlined in #3524
<!-- Finances tab -->
<md-tab label="Finance" md-on-select="$root.updateTabUrl('finance')" ng-if="true || gamesShow.resource.can_manage">
<md-tabs md-no-bar md-stretch-tabs="always" class="inner-tabs">
<md-tab>
<md-tab-label>
<md-icon md-font-library="material-icons">camera_alt</md-icon>
Subtab-1
</md-tab-label>
<md-tab-body>
content
</md-tab-body>
</md-tab>
<md-tab>
<md-tab-label>
<md-icon md-font-library="material-icons">location_on</md-icon>
Subtab-2
</md-tab-label>
<md-tab-body>
more content
</md-tab-body>
</md-tab>
</md-tabs>
</md-tab>