如何将条件减少到一行？

Question

我这样设置条件：

<mat-chip-list>
    <mat-chip color="accent" *ngIf="letter.status == 'Completed'" selected>
        {{ letter.status }}
    </mat-chip>
    <mat-chip color="warn" *ngIf="letter.status == 'In Work'" selected>
        {{letter.status }}
    </mat-chip>
</mat-chip-list>

是否可以将其缩小，使其看起来像这样：

<mat-chip color="letter.status == 'Completed' ? accent : warn" selected>
    {{ letter.status }}
</mat-chip>

Answer 1

@Input() color: ThemePalette Theme color palette for the component.

颜色是输入属性

color="accent"静态
[color]="expr ? 'accent' : 'warn'"动态

<mat-chip-list>
  <mat-chip
    [color]="letter.status == 'Completed' ? 'accent' : 'warn'"
    selected
    selected
  >
    {{ letter.status }}
  </mat-chip>
</mat-chip-list>

Stackblitz

如何将条件减少到一行？

How can the condition be reduced to one line?

angular-material

angular