web-dev-qa-db-ja.com

Angular-'ngValue'は 'mat-option'の既知のプロパティではないため、バインドできません

angular 5を使用していますが、コンソールエラーが表示されます。

「mat-option」の既知のプロパティではないため、「ngValue」にバインドできません

テンプレートは次のようになります。

  <mat-select placeholder="Select Book" name="patient" [(ngModel)]="selectedBook">
     <mat-option *ngFor="let eachBook of books" [ngValue]="eachBook">{{eachBook.name}}</mat-option>
  </mat-select>

MatSelectModuleとMatOptionModuleの両方をインポートしました。

どうすればこれを解決できますか？

angularangular5
9
Manoj Shrestha

値を使用する必要があります

[value]="eachBook"
8
Sajeetharan

受け入れられた答えは解決策ではなく、回避策です。valueおよび[ngValue]はさまざまな目的に役立ちます。 valueは単純な文字列値に使用できますが、[ngValue]は、文字列以外の値をサポートするために必要です。

ドキュメントごと：

FormsModuleまたはReactiveFormsModuleをインポートした場合、この値アクセサーは、フォームディレクティブを持つ選択コントロールでアクティブになります。有効にするために特別なセレクタを追加する必要はありません。

このエラーが発生する場合は、FormsModuleまたはReactiveFormsModuleのいずれかをアプリにインポートする必要があります。

たとえば、app.module.ts：

import { FormsModule } from '@angular/forms';

// ...

imports: [
    FormsModule,
    ...
]
9
Mark

私は同じ問題に出会いました。私にとっての解決策は、「ReactiveFormsModule」をインポートすることです。したがって、[ngValue]オブジェクトをバインドします。

1
Emon Zan