Ошибка Angular: Can't bind to 'ngModel' since it isn't a known property of 'input'

Question

Пытался применить ngModel, но выдает ошибку. Вот код шаблона:

<button class="btn btn-primary" (click)="addCar()" >Добавить машину</button>
<p>{{ addCarStatus }}</p>
<hr>

<app-car></app-car>
<app-car></app-car>

<hr>

<input type="text" class="form-control" #myinpt (keyup.enter)="onKeyUp(myinpt.value)" >
<input type="text" class="form-control" [(ngModel)]="inputText">
<p>{{ inputText }}</p>

Вот код компонента:

import { Component } from '@angular/core';

@Component({
  selector: 'app-cars',
  templateUrl: './cars.component.html',
  styleUrls: ['./cars.component.css']
})
export class CarsComponent {
  addCarStatus = '';
  inputText = 'Default Text';

  addCar() {
    this.addCarStatus = 'Машина добавлена';
  }

  onKeyUp(value) {
    this.inputText = value;
  }
}

И вот такая ошибка:

Error:(11, 41) Angular: Can't bind to 'ngModel' since it isn't a known property of 'input'.

В чем может быть причина?

score 1 · Answer 1 · answered Oct 19 '17 at 21:39

1

Забыли закрыть тег, исправьте на:

<input type="text" class="form-control" #myinpt (keyup.enter)="onKeyUp(myinpt.value)"/>
<input type="text" class="form-control" [(ngModel)]="inputText"/>

answered Oct 19 '17 at 21:39

Санаев

1,875

Тэг можно и не закрывать и ошибкой это не будет – Sergey Rogachev Oct 20 '17 at 06:17

score 1 · Accepted Answer · answered Oct 20 '17 at 06:16

1

Думаю причина в том, что не подключен FormsModule в вашем модуле, в котором объявлена компонента

answered Oct 20 '17 at 06:16

Sergey Rogachev

632
6
18

Да, действительно проблема была в этом, спасибо – Иван Глушков Oct 20 '17 at 08:36

Ошибка Angular: Can't bind to 'ngModel' since it isn't a known property of 'input'

2 Answers2