Angular - 无法绑定(bind)到 'ngValue'，因为它不是 'mat-option' 的已知属性

Question

我正在使用 angular 5，但出现了控制台错误:

Can't bind to 'ngValue' since it isn't a known property of 'mat-option'

我的模板如下所示:

  <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。

我们如何解决这个问题？

Answer 1

公认的答案不是解决方案，而是变通方法，因为 value 和 [ngValue] 有不同的用途。 value 可用于简单的字符串值，而 [ngValue] 是支持非字符串值所必需的。

根据文档:

If you have imported the FormsModule or the ReactiveFormsModule, this value accessor will be active on any select control that has a form directive. You do not need to add a special selector to activate it.

如果您收到此错误，您很可能需要将 FormsModule 或 ReactiveFormsModule 导入到您的应用中。

例如，在app.module.ts中:

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

// ...

imports: [
    FormsModule,
    ...
]