Angular - 如何在插值中写入条件?

时间:2017-11-23 13:51:52

标签: angular angular-material angular2-ngmodel

我有一张正在填写add client表格的表格。它工作正常,并显示更改。问题是我有一个选择列表,用户在其中选择特定的源,然后将其保存在ngmodel中。这是代码。

选择列表

 <mat-select [(ngModel)]="model.source" name="source" placeholder="Select Source ">
      <mat-option [value]="1 ">Upwork</mat-option>
      <mat-option [value]="2 ">Refer from Friend</mat-option>
      <mat-option [value]="3 ">Other</mat-option>
    </mat-select>

现在在我的表格中,根据选择显示的值为1或2或3。我想写一些东西,像这样的插值条件。

表格字段

<ng-container matColumnDef="source">
  <mat-header-cell *matHeaderCellDef> Source </mat-header-cell>
  <mat-cell *matCellDef="let element"> {{element.source ? if value is 1 : display (upwork), if value is 2 : display(refer from friend)}} </mat-cell>
</ng-container>

有些事情,我在angularjs中确实喜欢它。我不确定Angular

1 个答案:

答案 0 :(得分:26)

如果

,您可以使用嵌套的三元组
{{element.source == 1 ? 'upwork' : (element.source == 2 ? 'refer from friend' : '')}}

或者可能更好

export class MyComponent {
  sourceNames = {1: 'upwork', 2: 'refer from friend', 3: 'other' };
}
{{sourceNames[element.source]}}