각도 2,4 재료 탭에 동적 클래스를 추가하는 방법은 무엇입니까?

Question

각도 4 재질 탭에 클래스를 추가하려고합니다. 나는 지옥을 찾지 못했다. 옵션을 찾지 못했습니다. 심지어 주석 span 요소로 래퍼와 노력이 하나

<mat-tab-group disableRipple class="demo-tab-group" (selectedTabChange)="selectedDataTab($event)" [(selectedIndex)]="selectedIndex"> 
    <!-- <span *ngFor="let tab of gridTabName" [ngClass]="{'c2-hide': tab.recordId!=gridData.recordId}"> --> 
     <mat-tab class="c2-upper-case" *ngFor="let tab of gridTabName" label="{{tab.name}}" [ngClass]="{'active': selectedItem===tab}"> 
     </mat-tab> 
    <!-- </span> --> 
</mat-tab-group> 

을 시도했다. 그러나 아무것도 작동하지 않습니다. 그리고 그런데 [ngClass] 속성이 작동하지 않습니다 mat-tab

Answer 1

당신이 무엇을 하려는지는 확실하지 않습니다.하지만 다른 클래스를 덮어 쓰지 않고 각 탭에 새 클래스를 추가하려고한다고 말할 수 있습니다. . 이 시도 : 코드에서

[class.c2-hide]="tab.recordId!=gridData.recordId" 

을 :

<mat-tab-group disableRipple class="demo-tab-group" (selectedTabChange)="selectedDataTab($event)" [(selectedIndex)]="selectedIndex"> 
     <mat-tab class="c2-upper-case" *ngFor="let tab of gridTabName" label="{{tab.name}}" [ngClass]="{'active': selectedItem===tab}" 
[class.c2-hide]="tab.recordId!=gridData.recordId" 
> 
     </mat-tab> 
</mat-tab-group>