angularjs - 在 Jasmine 单元测试中设置 ReactiveForm 的值

Question

我正在尝试学习如何在 Angular 中对reactiveForm进行单元测试。

我想要做的是设置一个字段的值，然后在添加值后检查表单是否有效。

这就是我必须要做的:

Jasmine 测试片段

it('Filled in form is valid', async(() => {
      const fixture = TestBed.createComponent(AppComponent);
      fixture.detectChanges();

      const component = fixture.componentInstance; 
      component.userForm.setValue({
        value:{
              firstName : ["Bob"]
              }
      })
 }));

形式:

<form [formGroup]="userForm" novalidate (ngSubmit)="onSubmit()" >
  <div class="form-group">
    <label class="center-block">first Name:
      <input class="form-control" formControlName="firstName">
    </label>
    <label class="center-block">first Name:
      <input class="form-control" formControlName="lastName">
    </label>
    <button type="submit" >Submit</button>
  </div>
</form>

我从 Karma 收到以下错误消息:

Failed: Must supply a value for form control with name: 'firstName'.

Answer 1

试试这个:

component.userForm.controls.firstName.setValue('bob');

然后将表单输入设置为您想要的内容。