如何使用static2预填充字段并使用angular2获取空白部分

时间:2018-05-29 08:18:55

标签: angular angular-reactive-forms

我作为ts中的静态数据做了紧急事件。所以现在我想要将静态数据填入两个部分。 任何人都可以建议我如何做或提供任何链接。 我对反应形式很新,所以请帮忙。

TS:

this.emergencyContactForm.patchValue({
  ContactName: this.Emergencies[0].ContactName,
  Phone: this.Emergencies[0].Phone,
  Relationship: this.Emergencies[0].Relationship,
});
      this.emergencyContactForm = this._fb.group({
      itemRows: this._fb.array([this.createItem()])
    });
  }

我没有得到如何将数据提取到现场。请帮忙

2 个答案:

答案 0 :(得分:1)

由于您emergenciesarray,因此您应该有multiple formgroup个实例

为此,您应该loop emergencies并首先创建multiple inputs

this.Emergencies.forEach(
emergency => {
  const control = <FormArray>this.emergencyContactForm.get('itemRows')['controls'];
  control.push(this.createItem());
})

for (let entry in someArray) {
  this.emergencyContactForm.get('itemRows')['controls'][i].patchValue({ 
        ContactName: emergency.ContactName, 
        Phone: emergency.Phone, 
        Relationship: emergency.Relationship, 
      }) 

}

这会为您multiple inputselements的{​​{1}}个数创建array

然后在 html 中,您可以这样使用:

<div class="col-lg-12 col-md-12 col-sm-12 col-12 no-padd pt-4" formArrayName="itemRows" *ngFor="let itemrow of emergencyContactForm.get('itemRows').controls;let i = index;" [formGroupName]="i">
   <div>
      <label class="col-lg-4 col-md-4 col-sm-4 col-xs-6">Contact's Name</label>
      <input type="text" placeholder="Contact's Name" class="col-lg-6 col-md-6 col-sm-6 col-xs-6" formControlName="ContactName" 
      />
    </div>
</div>

答案 1 :(得分:0)

我可以看到您的静态数据是数组'紧急',并且您正尝试使用'紧急情况'修补表单值。