डेटा को साफ़ किए बिना प्रिस्टिन पर सेट फॉर्म

Question

मेरे पास एक ऐसा फॉर्म है जो <input type="text"> तत्वों की एक सूची प्रदर्शित करता है। वे सभी एक सामान्य बचत बटन साझा करते हैं जो तब तक अक्षम होता है जब तक कि फॉर्म गंदे न हो जाए। फिर, जब उपयोगकर्ता सहेजें बटन पर क्लिक करता है, तो डेटा सर्वर पर सबमिट किया जाएगा। यदि सर्वर ने डेटा को सफलतापूर्वक सहेजा है, तो मैं फॉर्म को एक प्राचीन स्थिति में रीसेट करना चाहता हूं, लेकिन मैं फॉर्म में सभी डेटा रखना चाहता हूं ताकि उपयोगकर्ता डेटा को और संपादित कर सकें।

खोज के बाद, मुझे NgForm.reset() विधि मिली है। हालांकि यह प्रपत्र को प्रपत्र पर सेट करता है, दुर्भाग्यवश यह फ़ॉर्म भी साफ़ करता है। रीसेट विधि में मान पैरामीटर प्रतीत होता है, लेकिन मुझे यह पता लगाना प्रतीत नहीं होता कि यह क्या करता है। फिर भी, मैं नहीं चाहता कि डेटा साफ़ हो गया हो।

मैंने myForm.pristine = true भी कोशिश की है, लेकिन इससे किसी कारण से पृष्ठ का पुनः लोड हो जाता है।

Here is a plunkr demonstrating the problem।

Answer 1

फिलहाल मैं दो संभावित समाधान सुझा सकता हूं। पहले एक, वास्तव में आप क्या सुझाव दिया है के करीब है के रूप में रूप की reset विधि निम्न हस्ताक्षर है और पहली बार एक तर्क के रूप में प्रपत्र मूल्य स्वीकार करता है:

//@angular/forms/src/model.d.ts: 
reset(value?: any, {onlySelf}?: { onlySelf?: boolean; }): void; 

प्रस्तुत हैंडलर में, हम पिछले राज्य की एक प्रति पर कब्जा :

const { myForm: { value: formValueSnap } } = this; 

और रीसेट ही कार्य करें:

this.myForm.reset(formValueSnap, false); 

बार, जब वहाँ rese करने के लिए कोई संभावना थी से एक अन्य विकल्प टी फॉर्म, एक सहायक विधि बनाना है, जो प्रत्येक नियंत्रण को pristine के रूप में चिह्नित करेगा और डेटा रखेगा। इसे रीसेट करने के स्थान पर एक ही सबमिट सहायक में बुलाया जा सकता है।

private _markFormPristine(form: FormGroup | NgForm): void { 
    Object.keys(form.controls).forEach(control => { 
     form.controls[control].markAsPristine(); 
    }); 
} 

अद्यतन plunkr से लिंक करें।

Answer 2

जो आप खोज रहे हैं myForm.markAsPristine() है।

Answer 3

आप टेम्प्लेट संचालित रूपों का उपयोग करने की हो और आप अपने घटक में कुछ इस तरह है: @ViewChild('myForm') myform: any;

मैंने पाया कि markAsPristine() आपके प्रपत्र के रूप संपत्ति पर एक समारोह है। तो यह this.myform.form.markAsPristine() होगा।

बस सोचा कि अगर मैं परिभाषित नहीं किया गया तो markAsPristine() पर आने के मामले में मैं इसे जोड़ दूंगा।

Answer 4

मैं एक markAsPristine() form संपत्ति में नहीं मिला है, लेकिन मैं एक _pristine संपत्ति, this.myForm['form']._pristine जो true करने के लिए सेट किया जा सकता है पाया।

@ViewChild('myForm') myForm: ElementRef; 
this.myForm['form']._pristine = true; 

Answer 5

मुझे लगता है कि मैं अपने विधि पर यह किया हल:

form.controls['contato'].reset();