angular - 无法绑定(bind)到 'ngModel'，因为它不是 'textarea' 的已知属性

Question

在使用 Jasmine 测试运行 Karma 时，我收到以下错误:

无法绑定(bind)到“ngModel”，因为它不是“textarea”的已知属性。

不过，我已经在我的 app.module 中导入了 FormsModule，并且我已经将 FormsModule 添加到 testBed。

应用程序本身运行正常，只有在运行 Karma 时才会出现此问题。

应用程序中没有子模块。

我使用 Angular 4.0.0 和 Angular CLI 1.0.4。

应用程序模块.ts

@NgModule({
  declarations: [
    AppComponent,
    NoteComponent,
    NotesListComponent,
    AddNoteButtonComponent,
    AboutComponent,
    NoteWrapperComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    CommonModule,
    RouterModule.forRoot([ /** Rest of the code... **/

note.component.html

<textarea title="" class="no-extra n-note__textarea n-note__textarea--transparent" [(ngModel)]="note.description"
              name="description" (blur)="updateNote($event)">
      {{note.description}}
    </textarea>

注意.component.spec.js

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { HttpModule } from '@angular/http';

import { expect, assert } from 'chai';

import { NoteComponent } from './note.component';
import { Note } from './note';
import { BrowserModule } from '@angular/platform-browser';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';


describe('NoteComponent', () => {
  let component: NoteComponent;
  let fixture: ComponentFixture<NoteComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [NoteComponent],
      imports: [HttpModule, BrowserModule, CommonModule, FormsModule],
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(NoteComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should be defined', () => {
    assert.isDefined(NoteComponent);
  });

  it('should be created', () => {
    expect(component).to.be.an('object');
  });

  describe('public API', () => {
    const note: Note = new Note(1, '', '');

    it('markAsDone method should set done parameter to true', () => {
      component.note = note;
      component.markAsDone();
      expect(note._done).to.be.true;
    });

    it('markAsDiscarded method should set discarded parameter to true', () => {
      component.note = note;
      component.markAsDiscarded();
      expect(note._deleted).to.be.true;
    });

    it('markAsStarred method should set starred parameter to true', () => {
      component.note = note;
      component.markAsStarred();
      expect(note._starred).to.be.true;
    });
  });
});

Answer 1

请注意，我看到您已经这样做了，但是，这解决了我的问题。

在我的规范中，我添加了:

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

然后将 FormsModule 添加到文本床配置的导入部分。