文章/答案/技术大牛

发布

社区首页 >问答首页 >错误错误:找不到路径为Angular FormArray的控件

问错误错误:找不到路径为Angular FormArray的控件
EN

Stack Overflow用户

提问于 2021-06-26 10:35:17

回答 1查看 760关注 0票数 0

我正在使用autocomplete进行匿名formArray输入(自动完成)来查找项目。

添加自动完成后，自动完成输入不能正常工作，尽管它可以独立工作。

错误消息为ERROR Error: Cannot find control with path: 'orderItems -> 0 -> search'

你能帮我改进一下代码吗？

谢谢。

 <form [formGroup]="orderForm">
    <div formArrayName="orderItems">
      <div *ngFor="let orderItem of getControls(); let i = index" [formGroupName]='i'>
        <p-autoComplete
        formControlName="search"
        (onSelect)="onSelect($event)"
        [suggestions]="list">
        </p-autoComplete>
      </div>
    </div>
    <p-button (click)="onAdd()"> add </p-button>
</form>

public orderItems = new FormArray([])
public orderForm: FormGroup;

ngOnInit(): void {
    this.orderForm = new FormGroup({
      'orderItems': this.orderItems,
      search: this.fb.array([
        this.fb.control('')
      ])
    });

    this.orderForm
    .get('search')
    .valueChanges.pipe(debounceTime(1000))
    .subscribe((value) => {
      if(value === '') {return null};
      this.getList(value)
    })
}

  getControls() {
    return (<FormArray>this.orderForm.get('orderItems'))
    .controls;
  }

  get search() {
    return this.orderForm.get('search') as FormArray;
  }

angular

angular-reactive-forms

formarray

angular2-formbuilder

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-06-26 22:12:32

最初使用空数组设置表单

buildForm() {
    this.orderForm = this.fb.group({
      orderItems: this.fb.array([]),
    });
  }

然后获取数组的数据并填充该数组

setOrderItemArray() {
    const orderItemsArray = this.orderForm.get('orderItems') as FormArray;
    this.orderItemsList.forEach(item => {
      orderItemsArray.push(this.buildOrderItemsForm(item))
    });
  }

  buildOrderItemsForm(item): FormGroup {
    return this.fb.group({
      id: item.id,
      search: item.search,
      name: item.name
    })
  }

现在，您在数组的每个对象中都有一个' search‘实例，并且可以为每个对象单独使用搜索自动完成。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/68138745

复制

相似问题

问错误错误:找不到路径为Angular FormArray的控件
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问错误错误:找不到路径为Angular FormArray的控件EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问错误错误:找不到路径为Angular FormArray的控件
EN