Ngmodel не является свойством ввода

Question

У меня проблема с использованием NgModel, он не работает, когда я хочу сохранить данные из ввода.

Uncaught Error: Template parse errors:
Can't bind to 'NgModel' since it isn't a known property of 'input'. ("
      placeholder="Account number"
      value="{{ account.number }}"
      [ERROR ->][(NgModel)]="newAccountNumber"
    />
  </mat-form-field>

Я уже искал решение, но единственное, что я обнаружил, - это ввести FormsModule и MatInputModule.и у меня есть эти входные данные.

imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule,
MatMenuModule,
MatIconModule,
MatToolbarModule,
MatButtonModule,
MatTableModule,
MatFormFieldModule,
MatInputModule,
BrowserAnimationsModule,
MatSelectModule,
MatCardModule,
NoopAnimationsModule,
FormsModule,
ReactiveFormsModule
]

<mat-form-field class="example-full-width">
    <input
      matInput
      placeholder="Account number"
      value="{{ account.number }}"
      [(NgModel)]="newAccountNumber"
    />
     </mat-form-field>

Что я должен сделать, чтобы правильно сохранить данные из ввода?

Answer 1

Попробуйте использовать [(ngModel)] вместо [(NgModel)]. Директива модели должна начинаться со строчной буквы

Для получения более подробной информации смотрите Angular docs https://angular.io/api/forms/NgModel

Answer 2

Попробуйте:

Попробуйте ngModel вместо NgModel

<mat-form-field class="example-full-width">
    <input
      matInput
      placeholder="Account number"
      value="{{ account.number }}"
      [(ngModel)]="newAccountNumber"
    />
     </mat-form-field>

Answer 3

Вам необходимо импортировать FormsModule в app.module или в модуль, где объявлен ваш компонент.

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

@NgModule({
  imports: [
    FormsModule,
    ...
  ],
  declarations: [
  ...
  ]
})