Angular 2 ngModel雙向綁定

Question

我試圖測試Angular2的雙向綁定，但我總是得到這個

錯誤： 因為它不是'input'的已知屬性，所以無法綁定到'ngModel'。

我該如何解決？

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


@Component({
  selector: 'impure-pipe',
  template: `<input type="text" [(ngModel)]='a'> <p>{{ a| calcPipe:b}}</p>`
})
export class PipesAppComponent {

  a: number = 2;
  b: number = 2;

}

Answer 1

正如它在本頁上所述，Angular 2網站上的模板語法

在可以在雙向數據綁定中使用ngModel指令之前，我們必須導入FormsModule並將其添加到Angular模塊的導入列表中。 在“表單”一章中了解有關FormsModule和ngModel的更多信息。

您是否在FormsModule導入了app.module.ts ？

import { NgModule } from '@angular/core';
import { BrowserModule }  from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule
  ],
  declarations: [
    AppComponent
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

Answer 2

確保導入FormsModule 。

Answer 3

您是否在app.module.ts中添加了FormsModule的定義？

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


@NgModule({
  imports: [
    FormsModule
  ],