En mi código, tengo una pantalla que uso para diferentes elementos. En esta pantalla, tengo una tabla. Quiero cambiar el encabezado de una de las columnas de acuerdo con SourceType. Cuando intento eso como he escrito a continuación, da un error. ¿Qué debo hacer, utilizar para lograr lo que quiero?
HTML:
<ng-container matColumnDef="DeliveryNumber"> <th mat-header-cell *matHeaderCellDef *ngIf="_stockEntry.SourceType != 49"> Tesellüm No </th> <th mat-header-cell *matHeaderCellDef *ngIf="_stockEntry.SourceType == 49"> Parti No </th> <td mat-cell *matCellDef="let row; let i = index"> <span *ngIf="EditIndex != i">{{row.DeliveryNumber}}</span> <mat-form-field floatLabel="never" *ngIf="EditIndex == i" class="w-100-p"> <mat-select [(ngModel)]="row.DeliveryNumber" required name="DeliveryNumber"> <mat-option *ngFor="let prm of deliveryList" [value]="prm.DeliveryNumber"> {{prm.DeliveryNumber}} </mat-option> </mat-select> </mat-form-field> </td> </ng-container>No puede tener varias directivas estructurales ( *ngIf y *matHeaderCellDef ) en un elemento. Entonces, lo que puede hacer es tener ngIf en un ng-container :
<ng-container matColumnDef="DeliveryNumber"> <th mat-header-cell *matHeaderCellDef > <ng-container *ngIf="_stockEntry.SourceType !== 49">Tesellüm No </ng-container> <ng-container *ngIf="_stockEntry.SourceType == 49">Parti No </ng-container> </th> <td mat-cell *matCellDef="let row; let i = index"> <span *ngIf="EditIndex != i">{{row.DeliveryNumber}}</span> <mat-form-field floatLabel="never" *ngIf="EditIndex == i" class="w-100-p"> <mat-select [(ngModel)]="row.DeliveryNumber" required name="DeliveryNumber"> <mat-option *ngFor="let prm of deliveryList" [value]="prm.DeliveryNumber"> {{prm.DeliveryNumber}} </mat-option> </mat-select> </mat-form-field> </td> </ng-container>