如何在特定的反应式表单控件上设置值？

Question

我有一个带有几个单选表单控件的表单组。一台收音机，用于照片、无人机、平面图等

this.services.photo 例如是一组服务。每个单选组让您 select 从每个单选组中选择一个选项。即，1 张照片选择，1 无人机选择，1 平面图选择。

我已经能够从服务中获取我的数据，但我无法使用数据预填充表单。如何遍历我的服务数据集合并设置单选按钮的值？我现在正在做的是行不通的。或者有没有更好的方法来设置它以使其更简单。

export class CartComponent implements OnInit {

  public myForm:FormGroup;
  public services;
  stepName = "cart";
  constructor(private fb:FormBuilder, private bookerData:BookerService, private settings:FirebaseService, private route:ActivatedRoute, private zone:NgZone) { 
    this.services = this.route.snapshot.data['cartSettings'].services 
  }


  ngOnInit() {
    this.myForm = this.fb.group({
      photo : new FormControl(this.services.photo),
      drone: new FormControl(this.services.drone),
      floorplan: new FormControl(this.services.floorplan),
      video: new FormControl(this.services.video)

    })
    if(this.bookerData.isValidStep(this.stepName)){
      let data = this.bookerData.getStepData(this.stepName)
      console.log(data);

      _.forOwn(data, (v, k)=>{
        this.myForm.get(k).patchValue(v)
      })
    }
  }

}

Answer 1

FormControl 构造函数接受您可以使用的 'initial state' 值。

email: new FormControl('default value', Validators.compose([
            Validators.required,
            Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$')
        ])),

如果您的数据晚于启动 (ngOnInit)，我会建议 ngModel binding，以便在您获取表单数据时更新值。

如何在特定的反应式表单控件上设置值？

How do I set a value on a specific reactive form control?

angular

angular-reactive-forms