错误:找不到带有路径的控件-角度formControlName看不到{{form.value | json}}显示

问题描述 投票:0回答:1

[使用formBuilder创建新的Worker时,我需要将引用(Firestore密钥)传递给Worker提供的服务,因为我希望它们(键)成为复选框上的formControlName指令:

 buildForm = () => {this.workerForm = this.formBuilder.group({
    name: ['', {validators: [Validators.required]}],
    services: this.formBuilder.group({
    })})

在字段“服务”中,我想配对-firebaseServiceKey:否。我不确定是否可以使用* ngFor动态地执行此操作(向对象添加属性),所以我做了一个功能:

mapControlPaths = () => {
    this.servicesService.getServicesKeys().subscribe(res => res.map(key => 
      this.workerForm.value.services[key] = false
        ))}

似乎正常(我看到带有前置标记的结果):

"services": {
    "0IyxGP51E3rSvUZfJdPP": false,
    "80MBmjEOeSc44jluVWjf": false,
    "ELaMKPQZ0ejHeaOzzBtS": false
  }

但是,当我在HTML模板中添加以下行时:

  <div formGroupName="services">
        <label *ngFor="let service of services" for="services">{{service.name}}
            <input formControlName="{{service.key}}" type="checkbox" name="services" id="{{service.key}}">
        </label>
    </div>

我收到错误:

错误错误:找不到路径为'services->的控件0IyxGP51E3rSvUZfJdPP'。

但是如果我手动键入键(没有功能),并且我的组件以此开头:

buildForm = () => {
this.workerForm = this.formBuilder.group({
  name: ['', { validators: [Validators.required] }],
  services: this.formBuilder.group({
    "0IyxGP51E3rSvUZfJdPP": false,
    "80MBmjEOeSc44jluVWjf": false,
    "ELaMKPQZ0ejHeaOzzBtS": false
  })
})

一切正常。我认为这是一个异步问题,但显然不是。那是什么问题?

angular firebase nosql angular-reactive-forms ngfor
1个回答
0
投票

我认为您应该使用FormArray而不是FormGroup,因为您有一个键-值对数组。

© www.soinside.com 2019 - 2024. All rights reserved.