Issue
I am using angular & material for my tab, Below is my tab code.
Right now it is loading all the three tabs on single shot. But I need to load this component on click only. I saw the we have option to capture the click event. But I don't know to load the component on click of the tab.Please help me to load the component on clik
<mat-tab-group>
<mat-tab label="Region">
<app-region><app-region>
</mat-tab>
<mat-tab label="Country">
<app-country><app-country>
</mat-tab>
<mat-tab label="State">
<app-state><app-state>
</mat-tab>
</mat-tab-group>
Solution
You should use <ng-template matTabContent>
:
<mat-tab-group>
<mat-tab label="Region">
<ng-template matTabContent>
<app-region><app-region>
</ng-template>
</mat-tab>
<mat-tab label="Country">
<ng-template matTabContent>
<app-country><app-country>
</ng-template>
</mat-tab>
<mat-tab label="State">
<ng-template matTabContent>
<app-state><app-state>
</ng-template>
</mat-tab>
</mat-tab-group>
Answered By - NeNaD
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.