Angular 2: Итерация по реактивным элементам формы

Я хотел бы markAsDirty все элементы управления внутри FormGroup.

Ответ 1

Выяснилось, что Object.keys справится с этим..

    Object.keys(this.form.controls).forEach(key => {
      this.form.get(key).markAsDirty();
    });

Для Angular 8+ используйте следующее (основываясь на ответе Микеланджело):

    Object.keys(this.form.controls).forEach(key => {
      this.form.controls[key].markAsDirty();
    });

Ответ 2

Для чего стоит другой способ сделать это, не используя Object.keys(...) magic:

for (const field in this.form.controls) { // 'field' is a string

   const control = this.form.get(field); // 'control' is a FormControl

}

Ответ 3

Принятый ответ является правильным для плоской структуры формы, но не полностью отвечает на первоначальный вопрос. Веб-страница может требовать вложенных FormGroups и FormArrays, и мы должны учитывать это, чтобы создать надежное решение.

public markControlsDirty(group: FormGroup | FormArray): void {
    Object.keys(group.controls).forEach((key: string) => {
        const abstractControl = group.controls[key];

        if (abstractControl instanceof FormGroup || abstractControl instanceof FormArray) {
            this.markControlsDirty(abstractControl);
        } else {
            abstractControl.markAsDirty();
        }
    });
}

Ответ 4

    Object.keys( this.registerForm.controls).forEach(key => {
       this.registerForm.controls[key].markAsDirty();
    });

Ответ 5

Используя ответ @Marcos, я создал функцию, которую можно вызывать, передавая formGroup в качестве параметра, и он помечает все дочерние элементы управления formGroup как "грязные", просто чтобы сделать его пригодным для использования из большего количества мест вокруг кода, помещая его, например, в службу.

public touchAllFormFields(formGroup: FormGroup): void {
    Object.keys(formGroup.controls).forEach((key) => {
        formGroup.get(key).markAsDirty();
    });
}

Надеюсь, поможет ;)

Ответ 6

Кажется, что функция get больше не работает для получения определенных значений в вашей форме в Angular 8. Так вот, как я решил это, и поскольку ответы немного устарели, я думаю, что это могло бы помочь большему количеству пользователей. Основано на ответе @Liviu Ilea

for (const field in this.myForm.controls) { // 'field' is a string
  console.log(this.myForm.controls[field].value);
}

Ответ 7

Это то, что работает для меня

  private markFormGroupTouched(formGroup: FormGroup) {
      Object.keys(formGroup.controls).forEach((key) => {
      const control = formGroup.controls[key];
      control.markAsDirty();
      if ((control instanceof FormGroup)) {
        this.markFormGroupTouched(control);
      }
 });

}

Ответ 8

Я создаю эту функцию, чтобы сделать ее * У меня есть элемент управления с именем 'order' и передаю ему индекс.

{"conditionGroups": [
   {
     "order": null,
     "conditions": []
   }
  ]
}


updateFormData() {
    const control = <FormArray>this.form.controls['conditionGroups'];  
    control.value.map((x,index)=>{
    x.order = index; 
 })