कोणीय 4 में फॉर्म नियंत्रण सरणी में परिवर्तनों का पता कैसे लगाएं?

Question

मैं कोणीय 4 परियोजना पर काम कर रहा हूं। मुझे फॉर्म कंट्रोल सरणी के परिवर्तनों का पता लगाने की आवश्यकता है। जैसे मेरे पास प्रदाताओं नामक एक फॉर्म कंट्रोल सरणी है, इसके परिवर्तनों का पता कैसे लगाएं?

export class CustomFormArray { 
public form: FormGroup; 

constructor(private _fb: FormBuilder) { 
     this.form = _fb.group({ 
      providers: _fb.array([]) 
     }); 
    } 
} 

Answer 1

FormArray फैली AbstractControl तो यह valueChanges संपत्ति जो चांस का उत्सर्जन करता है है।

this.form = this.fb.group({ 
    providers: this.fb.array([]), 
}); 
(this.form.get('providers') as FormArray).push(new FormControl('', Validators.required)); 
(this.form.get('providers') as FormArray).push(new FormControl('', Validators.required)); 

(this.form.get('providers') as FormArray).valueChanges.subscribe(values => { 
    console.log(values); 
}); 

अपने टेम्पलेट में:

<input *ngFor="let field of form.controls.providers.controls;" [formControl]="field"> 

values प्रत्येक इनपुट फ़ील्ड का मान के साथ एक सरणी वापस आ जाएगी सदस्यता ले में जब परिवर्तन (व्याकरण की दृष्टि से या यूआई से) के किसी भी।

FormArray में कुछ भी नहीं होने पर मामले में कुछ भी नहीं है। बस निम्नलिखित घटक कोड का उपयोग करें।

(this.form.get('providers') as FormArray).push(this.fb.group({ 
     'name': '', 
     'age': '' 
    })); 

और टेम्पलेट हो जाएगा:

<div *ngFor="let field of form.controls.providers.controls;" [formGroup]="field"> 
    <input formControlName="name" placeholder="name"> 
    <input formControlName="age" placeholder="age"> 
</div> 

यहाँ

plunker

Answer 2

समान फॉर्म समूह के लिए आप इसे कैसे करते हैं। जब भी आप अपने फॉर्म सरणी के फॉर्म समूह को प्रारंभ करते हैं, तो बस अपने फॉर्म एरे के फॉर्म फॉर्म को इवेंट/सब्सक्राइब करें।

यहां नमूना है।

export class CustomFormArray { 
    public form: FormGroup; 

    constructor(private _fb: FormBuilder) { 
      this.form = _fb.group({ 
       providers: _fb.array([]) 
      }); 

     this.providers.push(this.createprovidersFormGroup()) 
     } 

    createprovidersFormGroup(){ 
      let form = this._formBuilder.group({ 
         abc: "abc" 


        }); 

       form.valueChanges.subscribe(data => { 
        console.log('Form changes', data) 
       }); 

     return form; 
     }