Angular 如何更新角形数组

Angular 如何更新角形数组,angular,Angular,我目前在我的角度反应式表单中使用一些表单数组,当我加载表单时用数据初始化这些表单数组。我想做的是重新加载/刷新一个表单数组,比如我的电子邮件,一个包含更新数据的表单数组 这就是我当前设置initila值的方式 this.form = this.fb.group({ first_name: [this.formData && this.formData.first_name], middle_name: [this.formData && this.

我目前在我的角度反应式表单中使用一些表单数组,当我加载表单时用数据初始化这些表单数组。我想做的是重新加载/刷新一个表单数组,比如我的电子邮件,一个包含更新数据的表单数组

这就是我当前设置initila值的方式

this.form = this.fb.group({
    first_name: [this.formData && this.formData.first_name],
    middle_name: [this.formData && this.formData.middle_name],
    last_name: [this.formData && this.formData.last_name],
 
    phones: this.fb.array([...phones]),
    emails: this.fb.array([...this.labeledEmailInputsOrNew(this.formData && this.formData.emails)]),
    recurring_events: this.fb.array([...recurring_events]),
    addresses: this.fb.array([...addresses]),
    
});
this.setInitials();
}
这是我如何为电子邮件创建表单数组的代码

createLabeledEmailInputs(inputs: IEmail[]): FormGroup[] {
        return inputs.map(input => this.createLabeledEmailInput(input));
    }

labeledEmailInputsOrNew(inputs: IEmail[] = []): FormGroup[] {
        return inputs && inputs.length
            ? this.createLabeledEmailInputs(inputs)
            : [this.createLabeledEmailInput()];
    }



createLabeledEmailInput(data?: IEmail) {
        return this.fb.group({
            id: [data && data.id],
            type: [data && data.type],
            address: [data && data.address],
            name: [data && data.name],
            source: [data && data.source],
            dflt: [data && data.dflt],
            dnmm: [data && data.dnmm],
            bounce: [data && data.bounce],
            otherLabel: [data && data.otherLabel],
        });
    }

所以我的问题是,如何用新加载的数据替换该数组中的所有数据?

您可以使用FormGroup.setValue方法

    const form = new FormGroup({
        first: new FormControl(),
        last: new FormControl()
      });
      
      console.log(form.value);   // {first: null, last: null}
      
      form.setValue({first: 'Nancy', last: 'Drew'});
      console.log(form.value);   // {first: 'Nancy', last: 'Drew'}
或FormGroup.patchValue

 formgroup.patchValue({name:’Mocrosoft’});

您可以通过调用
setValue
patchValue
来更新FormArray:

updteLabeledEmailInput(data?: IEmail) {
    return this.myForm.setValue([data && data.id,
        data && data.type,
        data && data.address,
        data && data.name,
        data && data.source,
        data && data.dflt,
        data && data.dnmm,
        data && data.bounce,
        data && data.otherLabel,
    ]);
}

setValue需要一个匹配整个结构或FormArray的数组,而patchValue可以获取数组的超集或子集。

经过一些研究,我找到了适用于我的情况的答案,因为我有一个Form元素数组。因为我知道数组的索引,所以可以使用.at(index)来修补或设置值

                 this.emails.at(index).patchValue( {
                    id: ta.data.id,
                    type: ta.data.type,
                    address:  ta.data.address,
                    name: ta.data.name,
                    source: ta.data.source,
                    dflt: ta.data.dflt,
                    dnmm: ta.data.dnmm,
                    bounce: ta.data.bounce,
                    otherLabel: ta.data.otherLabel
    });

我有点明白这一点,但我如何修补特定的电子邮件。在我的例子中,我有一个表单组,它保存在我的例子中,例如电子邮件数组。因此,电子邮件数组中有多个数组。例如,假设有3个电子邮件地址,我的索引为2,那么问题是,我如何仅使用索引1修补数组