Кутовий 2: Ітерація над елементами управління з реактивною формою

Я хотів би, щоб markAsDirtyусі елементи управління всередині FormGroup.

З'ясував, що 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();
    });

Для того, що варто, є інший спосіб зробити це, не використовуючи магію Object.keys (...) :

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

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

}

Прийнята відповідь є правильною для плоскої структури, але не повністю відповідає на вихідне запитання. Для веб-сторінки можуть знадобитися вкладені 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();
        }
    });
}

Використовуючи відповідь @Marcos, я створив функцію, яку можна назвати передачею formGroup як параметра, і вона позначає кожну форму дочірньої форми formGroup брудною, просто для того, щоб зробити її придатною для використання з інших місць навколо коду, поміщаючи її всередину служби, наприклад.

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

сподіваюся, це допоможе;)

Здається, ця get функція вже не працює для отримання конкретних значень у вашій формі в Angular 8, тож ось як я це вирішив на основі відповіді @Liviu Ilea.

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

Це те, що працює для мене

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

Я створюю цю функцію, щоб зробити це * У мене є елемент керування з ім'ям 'порядок', і передаю йому індекс.

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


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