首先检索数据以设置默认表单值？ （Angular2）

Question

问题

我正在设置一个非常复杂的表单，每次提交PATCH请求时，值都会重置为null。

在表单控件中，当我尝试将默认值设置为服务中加载的数据时，它将无法正常工作，因为数据不会立即可用/尚未保存到public model = Model[]

守则

   getControls() {
     let controlObj = {}

     for (var i = 0; i <= 7; i++) {
       this.field1 = "field-1-" + i

       testObj[this.field1] = new FormControl({value: this.model.name}, Validators.required)

     }
     this.controls = testObj
     return this.controls;
   }



   ngOnInit() {

     this.myService.getData()
       .subscribe(
         settings => {
           this.model = model;
           console.log(this.model)

         },
         error => console.error(error)
       )

     console.log(this.model)


     this.settingsForm = new FormGroup(
       this.getControls()
     )

   }

 }

摘要

new FormControl({value: this.model.name}无法检索此值，因为服务不会保存要在组件内再次使用的数据。

在运行其余功能之前，有没有办法让我首先将从get请求中检索到的信息保存在组件中？

我对为什么服务请求中的console.log(this.modal)返回数据感到有点困惑，但外部的那个返回null。

如果您需要更多代码，请告诉我 - 我已尽量避开最低限度以避免混淆。谢谢！

Answer 1

  

我对服务请求中的console.log（this.modal）返回数据的原因感到有点困惑，但外部的那个返回null。

因为它是异步过程。

console.log(this.model)之外的{p> subscribe可能会在this.model收到任何值之前执行，这就是显示为空的原因。

如果您想在getControls之后执行this.model，则将代码更改为

ngOnInit() {
    this.myService.getData()
       .subscribe(
         settings => {
            this.model = model;
            this.settingsForm = new FormGroup(
               this.getControls()
            )   
         },
         error => console.error(error)
       );
}