Angular no директива с "exportAs", установленным в "ngForm" с тестированием Karma - PullRequest
Новая
       9

Angular no директива с "exportAs", установленным в "ngForm" с тестированием Karma

0 голосов
/ 01 декабря 2018

Я пытаюсь проверить форму с помощью Кармы, но произошла следующая ошибка:

'Failed: Template parse errors: There is no directive with "exportAs" set to "ngForm"'.

Эта форма отлично работает, когда я запускаю ее вне Кармы.Код для формы выглядит так: 

<div class="container" fxLayout="row" fxLayoutGap="10px">
    <form novalidate [formGroup]="loginForm" #lForm="ngForm" (ngSubmit)="onSubmit()">
      <mat-form-field class="full-width">
        <input matInput formControlName="userName" placeholder="User Name" type="text">
      </mat-form-field>
      <mat-form-field class="full-width">
        <input matInput formControlName="password" placeholder="Password" type="password">
      </mat-form-field>
      <button
        type="submit"
        mat-button
        class="primary-button"
      >
        Login
      </button>
    </form>
</div>

И файл spec.ts выглядит так: 

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FlexLayoutModule } from '@angular/flex-layout';
import { FormsModule } from '@angular/forms';

import { LoginComponent } from './login.component';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        FormsModule,
        FlexLayoutModule
      ],
      declarations: [ LoginComponent ]
    })
    .compileComponents();
  }));

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

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Все, что я могу найти об этой ошибке, говорит о том, что импорт FormsModule исправит ошибку, но я уже сделал это, поэтому я не уверен, что еще делать.Я использую Угловой 7 и Карма 3 .

1 Ответ

0 голосов
/ 01 декабря 2018

Вы используете [formGroup] в вашей форме.

Итак, вы создаете реактивную форму.

Так что вам нужно импортировать ReactiveFormsModule, а не FormsModule.См. документацию .

Кроме того, вы определяете переменную lForm, но не используете ее.И вы устанавливаете novalidate ни за что, поскольку угловые формы делают это для вас.

...