दिलचस्प पोस्ट
अनचेक अपवाद या रनटाइम अपवाद के बीच अंतर सिर्फ नवीनतम संशोधन पाने के लिए git का उपयोग करना Symfony 2: एकाधिक और गतिशील डेटाबेस कनेक्शन जार के रूप में चलने पर क्लासपाथ संसाधन नहीं मिला ओपनएमपी समय और घड़ी () दो अलग-अलग परिणामों की गणना करता है Django में मैं पूर्ण / पूर्ण यूआरएल (डोमेन के साथ) कैसे प्राप्त करूं? मैं वीबीए / प्रवेश को परिभाषित करने के लिए चर की आवश्यकता कैसे कर सकता हूं? एचडीएफएस में डेटा ब्लॉक आकार, क्यों 64 एमबी? RemapColums के साथ remapColumnsByName मुक्त jqgrid में कैसे बदलें पटरियों में jquery-ui स्वत: पूर्ण सेट अप कैसे करें X-Forwarded-Proto HTTP शीर्षलेख का पूर्ण विवरण क्या है? विंडोज 7 पर विजुअल स्टूडियो 2013 स्थापित करें उपयोगकर्ता को छवि के लिए कैमरा या गैलरी चुनने की अनुमति दें .NET में एक ऑब्जेक्ट को serializing करते समय सभी xsi और xsd नामस्थानों को छोड़कर? एंड्रॉइड: अलार्म मैनेजर का उपयोग करते हुए एक पृष्ठभूमि कार्य चल रहा है

Angular2, * ngIf और स्थानीय टेम्पलेट चर

क्या कोई कृपया निम्नलिखित व्यवहार के पीछे क्या समझा सकता है:

कहते हैं कि हमारे पास एक Angular2 घटक है जिसमें एक _ मॉडल ऑब्जेक्ट है। फिर टेम्पलेट में हमारे पास यह है

<form> <input type="text" class="form-control" required [(ngModel)]="_model.firstName" ngControl="test2" #myInput > <br>Class: {{myInput?.className}} </form> 

_मॉडल एनजीओएनआईआईआईटी में खरोंच से बनाई गई शुरुआत से उपलब्ध है। इनपुट फील्ड ठीक से _model.firstName चर और लाइन के साथ पॉपुलेटेड है

<br>Class: {{myInput?.className}}

टेम्पलेट में सही ढंग से निम्नलिखित को प्रस्तुत करता है

Class: form-control ng-untouched ng-pristine ng-invalid

अब तक सब ठीक है। क्या मुझे भ्रमित करता है कि क्षण मैं * एनजीआईएफ जोड़ता हूं और मैं इनपुट फ़ील्ड को बदलता हूं

 <input *ngIf="_model" type="text" class="form-control" required [(ngModel)]="_model.firstName" ngControl="test2" #myInput > 

डबल घुंघराले ब्रेसिज़ प्रक्षेपण काम करना बंद हो जाता है क्योंकि जाहिरा तौर पर स्थानीय myInput वैरिएबल myInput नहीं होता है, जब भी कोड परिवर्तन में कुछ और नहीं होता है, _मॉडेल ऑब्जेक्ट अभी भी onNgInit() और इनपुट फ़ील्ड अभी भी ठीक से काम कर रहा है। केवल {{myInput?.className}} renders ही चीज़ है

Class:

क्या कोई ये समझा सकता है कि क्या हो रहा है और / या मुझे इस के लिए सही दस्तावेज के बारे में बताएगा?

अग्रिम में धन्यवाद!

संपादित करें:

यहां एक प्लंकर है जो प्रश्न में समस्या दिखाता है

निर्मित बग रिपोर्ट https://github.com/angular/angular/issues/8087

वेब के समाधान से एकत्रित समाधान "Angular2, * ngIf और स्थानीय टेम्पलेट चर"

हम एक स्थानीय टेम्पलेट चर को उसी तत्व पर, एक भाई तत्व पर, या किसी भी बच्चे तत्वों पर संदर्भित कर सकते हैं। – रेफरी

* एनजीआईफ़ / के लिए फैलता है

 <template [ngIf]="_model"> <input type="text" class="form-control" required [(ngModel)]="_model.firstName" ngControl="test1" #myInput> </template> 

इसलिए स्थानीय टेम्पलेट चर #myInput को केवल टेम्पलेट ब्लॉक (यानी, भाई और / या बाल तत्वों) के भीतर संदर्भित किया जा सकता है। इसलिए आपको किसी भी एचटीएमएल को डाल देना होगा जो टेम्पलेट के अंदर स्थानीय टेम्पलेट चर को संदर्भित करना चाहता है:

 <template [ngIf]="_model"> <input type="text" class="form-control" required [(ngModel)]="_model.firstName" ngControl="test1" #myInput > <br>Class (this works): {{myInput?.className}} </template> 

Plunker


यदि आपको इनपुट से संबंधित टेम्पलेट ब्लॉक के बाहर कुछ दिखाए जाने की आवश्यकता है, तो @ViewChildren('myInput') list:QueryList<ElementRef> और फिर परिवर्तनों की सदस्यता लें:

 ngAfterViewInit() { this.list.changes.subscribe( newList => console.log('new list size:', newList.length) ) } 

एपीआई डॉक्टर में अधिक प्रश्न सूची तरीकों को देखें।