कोणीय 2: प्रतिक्रियाशील रूप नियंत्रण पर Iterate

Question

मैं markAsDirtyएक के अंदर सभी नियंत्रण करना चाहूंगा FormGroup।

Answer 1

पता चला कि Object.keysइस संभाल सकते हैं ..

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

कोणीय 8+ के लिए, निम्नलिखित का उपयोग करें (माइकल एंजेलो उत्तर के आधार पर):

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

Comments

जब मैं onSubmit में इस फ़ंक्शन का उपयोग करता हूं तो मुझे त्रुटि मिलती है Cannot invoke an expression whose type lacks a call signature. Type 'AbstractControl' has no compatible call signatures.क्या किसी को पता है कि क्यों?

— मदि

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

— Foad

जब मैं Object.keys या यहां तक ​​कि "के लिए" में कोशिश करता हूं, तो मुझे कुछ भी नहीं मिलता है। फिर भी, यदि मैं कंसोल .log (form.controls) करता हूं, तो मैं ऑब्जेक्ट के साथ निहित सभी विभिन्न फॉर्म नियंत्रणों को देख सकता हूं। मैं चकरा गया।

— जेक शेक्सवर्थ

कोणीय 5 का उपयोग करते हुए, markAsDirty () / markAsTouched () किसी भी उप-फॉर्मग्रुप में पुनरावृत्ति नहीं करता है। मैंने एक पुनरावर्ती फ़ंक्शन में ऊपर दिए गए कोड को तोड़ दिया और इसे किसी भी उप-फ़ॉर्मग्रुप पर कॉल किया। उपयोगकर्ता द्वारा कभी भी किसी आवश्यक तत्व को नहीं छूने की स्थिति में, वर्तमान कोणीय सामग्री UI परियोजना बेहतर तरीके से काम करती है, जब उपयोगकर्ता उस बिंदु पर किसी को चिह्नित करने के लिए फ़ॉर्म सबमिट करने का प्रयास करता है, तो मैं इसे कॉल करता हूं।

— रॉबर्ट

मेरे पोस्ट को पढ़ने और अपने खुद के जवाब को अपडेट करने के लिए Thnx। आधिकारिक डॉक्स भी पुराने हैं इसलिए मुझे हर लाइन को प्रिंट करके यह पता लगाना था ...

— माइकल एंजेलो

Answer 2

इसके लायक क्या है, Object.keys (...) जादू का उपयोग किए बिना ऐसा करने का एक और तरीका है :

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

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

}

Comments

लूप का इंडेक्स कैसे प्राप्त करें?

— SVK

TSLint का उपयोग करने वालों के लिए, कोड काम करता है, लेकिन TSLint "for (in ...) स्टेटमेंट्स को if if (forin) के साथ फ़िल्टर किया जाना चाहिए।"

— येंफर

tslint इंगित कर रहा है, जावास्क्रिप्ट दस्तावेज के एक उद्धरण के लिए ... बयान में stackoverflow.com/questions/40770425/…

— Egle Kreivyte

Answer 3

एक फ्लैट फॉर्म संरचना के लिए स्वीकृत उत्तर सही है, लेकिन मूल प्रश्न का पूरी तरह से उत्तर नहीं देता है। एक वेब पेज के लिए नेस्टेड फॉर्म्स और फॉर्मअरेस की आवश्यकता हो सकती है, और हमें एक मजबूत समाधान बनाने के लिए इस पर ध्यान देना चाहिए।

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();
        }
    });
}

Comments

instanceofहमेशा टाइपस्क्रिप्ट द्वारा ट्रांसप्लेंट होने के बाद काम करेगा ?

— उल्लेखनीय

@ instanceof-उल्लेखनीय एक टाइपस्क्रिप्ट-विशिष्ट कीवर्ड नहीं है ( developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… ) न तो classडेटा प्रकार है।

— कीनन डिग्स

Answer 4

@Marcos उत्तर का उपयोग करते हुए मैंने एक फ़ंक्शन बनाया, जिसे एक फॉर्मग्रुप को पैरामीटर के रूप में पारित किया जा सकता है और यह प्रत्येक फॉर्मग्रुप बच्चों को गंदे को नियंत्रित करता है, बस कोड के चारों ओर अधिक स्थानों से इसे सेवा के अंदर डालने के लिए उपयोग करने योग्य बनाता है, उदाहरण के लिए।

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

आशा करता हूँ की ये काम करेगा ;)

Comments

उत्तम! सेवा में जोड़ा गया, w / इसी तरह के कार्यों के साथ क्लियरवैलिडेटर्स, अछूता, आदि के लिए नेस्टेड नियंत्रण के लिए पुनरावर्ती चेक जोड़ना चाह सकते हैं, लेकिन यह अभी के लिए काम करता है। धन्यवाद!

— mc01

Answer 5

ऐसा लगता है कि get फ़ंक्शन अब अपने रूप में विशिष्ट मानों को कोणीय 8 में पुनः प्राप्त करने के लिए काम नहीं कर रहा है, इसलिए मैंने @Liviu Ilea के उत्तर के आधार पर इसे हल किया है।

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

Comments

क्या आपको यकीन है? API डॉक में पहले से ही Abstract Control ( angular.io/api/forms/AbstractControl#get ) का तरीका है । मैं अभी तक विस्थापित नहीं हुआ। अब मुझे डर लग रहा है (⊙_ ◎)

— एलन

@AlanGrosz हाँ, मैंने देखा कि जब मैं इसे फिर से लिख रहा था लेकिन तब भी जब कंसोल में सभी लाइनों को प्रिंट करते हुए मुझे ऑब्जेक्ट पर कोई भी तरीका नहीं मिल रहा था। मुझे लगता है कि प्रलेखन पीछे है। अच्छी किस्मत पलायन!

— माइकल एंजेलो

मुझे नहीं लगता कि उन्होंने इसे हटा दिया, मेरे लिए कोणीय 8 में काम करें। इसके अलावा यह अभी भी दस्तावेज में है। angular.io/api/forms/AbstractControl#get

— Laszlo Sarvold

Answer 6

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

Answer 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);
    }
  });
}

Answer 8

मैं इसे बनाने के लिए यह फ़ंक्शन बनाता हूं * मेरा नाम 'ऑर्डर' के साथ नियंत्रण है, और उसके लिए इंडेक्स पास करें।

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


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