一个元素上不能有多个模板绑定。仅使用一个前缀为 * ("</mat-header-cell>

Question

我得到以下错误：

ERROR in Can't have multiple template bindings on one element. Use only one attribute prefixed with * ("                                </mat-header-cell>
<mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}" [ERROR ->]*ngIf="orderColumn.fieldType == 'date'">{{order[orderColumn.fieldName] | date: globalDateFormat}}</ma")
Can't have multiple template bindings on one element. Use only one attribute prefixed with * ("ateFormat}}</mat-cell><mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}" [ERROR ->]*ngIf="orderColumn.fieldType == 'text'">{{order[orderColumn.fieldName]}}</mat-cell>

以下是代码：

<mat-table  #table [dataSource]="dataSource" matSort #sort1="matSort"
matSortActive="id" matSortDirection="asc" matSortDisableClear>
<!-- Checkbox Column -->
<ng-container matColumnDef="row">
<mat-header-cell *matHeaderCellDef class="mat-column-checkbox">
Row
</mat-header-cell>
<mat-cell *matCellDef="let row" class="mat-column-checkbox">
1
</mat-cell>
</ng-container>

<ng-container *ngFor="let orderColumn of newOrderColumns;" matColumnDef="orderColumn.fieldName">
<mat-header-cell *matHeaderCellDef mat-sort-header class="{{orderColumn.fieldClass}}">{{orderColumn.fieldLable}}
</mat-header-cell>
<mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}" *ngIf="orderColumn.fieldType == 'date'">{{order[orderColumn.fieldName] | date: globalDateFormat}}</mat-cell>
<mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}" *ngIf="orderColumn.fieldType == 'text'">{{order[orderColumn.fieldName]}}</mat-cell>
<mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}" *ngIf="orderColumn.fieldType == 'Checkbox'">
<mat-checkbox (click)="$event.stopPropagation()"
[checked]="order[orderColumn.fieldName] == 'True'" [color]="'primary'">
</mat-checkbox>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
</mat-table>

请帮我解决这个问题。

Answer 1

不能在一个元素上有多个模板绑定*matCellDef和*ngIf是结构指令，在mat单元格中不能在一起。

您可以通过使用跨度或任何其他元素包装元素来构建相同的。例如，您可以尝试以下操作：

<ng-container *ngIf="orderColumn.fieldType == 'date'">
<mat-cell *matCellDef="let order" class="{{orderColumn.fieldClass}}"> 
{{order[orderColumn.fieldName] | date: globalDateFormat}}</mat-cell>
</ng-container>

https://angular.io/guide/structural-directives