angular2テスト： 'ngModel'は '入力'の既知のプロパティではないため、バインドできません。

Question

コントロールinputのangular2双方向バインディングをテストしようとしています。

Can't bind to 'ngModel' since it isn't a known property of 'input'. 

app.component.html

<input id="name" type="text" [(ngModel)]="name" /> 
<div id="divName">{{name}}</div> 

app.component.ts

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html' 
}) 
export class AppComponent implements OnInit { 
    name: string;  
} 

app.component.spec.ts

import { TestBed, async } from '@angular/core/testing'; 
import { AppComponent } from './app.component'; 
import { AppService } from './app.service'; 
describe('App: Cli',() => { 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     declarations: [ 
     AppComponent 
     ], 
     providers:[AppService] 
    }); 
    }); 

    it('divName', async(() => { 
    let fixture = TestBed.createComponent(AppComponent); 
    let comp = fixture.componentInstance; 
    comp.name = 'test'; 
    fixture.detectChanges(); 

    let compiled = fixture.debugElement.nativeElement;  
    expect(compiled.querySelector('divName').textContent).toContain('test'); 
    })); 
}); 

：ここにエラーがあります

Answer 1

FormsModule intをインポートする必要がありますo TestBed configfuration。

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

TestBed.configureTestingModule({ 
    imports: [ FormsModule ], 
    declarations: [ 
    AppComponent 
    ], 
    providers:[AppService] 
});