Question

我喜欢在NgClass上具有两个状态。状态为true且上课成功时，它会显示文本“开” 如果为假且出现类警告，则显示文本“关闭” 但是，如果状态错误为true，则类危险，我只需要显示“问题”

<td mat-cell class="status" *matCellDef="let element" [ngClass]="{
                      'alert alert-success': element.status ,
                      'alert alert-warning': element.status === false
                      ,'alert alert-danger' : element.error}"
                      > {{element.status ? 'On' : 'Off'}} </td>

Answer 1

 <td mat-cell class="status" *matCellDef="let element">
                      <span *ngIf="element.status || element.status==false">
                       <span *ngIf="element.status==true" class="alert alert-success">On</span>
                        <span *ngIf="element.status==false" class="alert alert-warning">off</span>
                        </span>
                         <span *ngIf="element.error" class="alert alert-danger">Problem</span>
                       </td>

Answer 2

它是这样工作的！

HTML

 <input
            type="text"
            placeholder="Company"
            name="company"
            value={props.profile.company}
            onChange={e => onChangeHandler(e)}
          />

Ts

    <ng-container matColumnDef="status">
      <th mat-header-cell *matHeaderCellDef mat-sort-header> Etat </th>
      <td mat-cell class="status" *matCellDef="let element" [ngClass]="iconDisplay(element)"
                  > {{stateDisplay(element)}} </td>
    </ng-container>

如何用ngClass替换另一个状态

2 个答案: