angular - 测试 FormArray

Question

我有一个 PhoneNumbersFormComponent 其模板如下所示:

<div [formGroup]="form">
    <div formArrayName="numbers">
      <input formControlName="countryPrefix">
      <input formControlName="number">
    </div>
</div>

我想通过 angular-cli 的 ng g component xxx 创建的默认测试

我得到的第一个错误是:

Cannot find control with name 'countryPrefix'

我解决了这个问题:

  beforeEach(() => {
    fixture = TestBed.createComponent(PhoneNumbersFormComponent);
    component = fixture.componentInstance;
    component.phoneNumbers = [];
    component.form = new FormGroup({
      countryPrefix: new FormControl(),
      number: new FormControl()
    });
    fixture.detectChanges();
  });

现在剩下的最后一个错误是:

Cannot find control with name 'numbers'

而且我不知道如何测试 formArrayName="numbers"

Answer 1

尝试这样的事情:

let array: FormGroup[] = [];
array.push(new FormGroup({
      countryPrefix: new FormControl(),
      number: new FormControl()
}));
let formArray = new FormArray(array);
component.form = new FormGroup({
       numbers: formArray // or array not totally sure
})