web-dev-qa-db-ja.com

Angular-補間で条件を書き込むにはどうすればよいですか？

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で好きでした

angularangular-materialangular2-ngmodel
15
Usman Iqbal

次の場合、ネストされた3項を使用できます。

{{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]}}
39
Günter Zöchbauer