कोणीय 8 में NgStyle के बारे में जानने के लिए आपको सब कुछ चाहिए



यह लेख आपको विभिन्न उदाहरणों के साथ कोणीय 8 में NgStyle की विस्तृत और व्यापक समझ प्रदान करेगा।

यदि आप पिछले कुछ समय से कोडिंग उद्योग में हैं, तो आप शायद पहले से ही जानते हैं कि गतिशील बदलाव विकसित करना वेब अनुप्रयोगों में काफी काम हो सकता है। प्रोग्रामिंग प्लेटफॉर्म के आधार पर आप अपनी जटिलता के स्तर का उपयोग करने के लिए चुनते हैं, लेकिन सौभाग्य से यह उपलब्धि आसानी से कोणीय 8 और एंगुलर के कुछ पिछले संस्करणों में भी प्राप्त की जा सकती है। इस लेख में, हम एगुलर 8 में एनस्टीस्टाइल पर चर्चा करेंगे।

कोणीय 8 में टेम्पलेट संपत्ति सिंटैक्स

इससे पहले कि हम सभी कार्यों और मॉड्यूल की खोज की गहराई में जाएं, कोणीय 8 के साथ आता है, आइए पहले हम देखें कि कोणीय 8 में संपत्ति सिंटैक्स कैसे है और हम शुद्ध जावा में रंग संपत्ति का रंग कैसे बदल सकते हैं।





ngstyle-in-angular

myDiv = document.getElementById ('my-div') myDiv.style.color = 'Orange' // अपने गुणों के माध्यम से div को अद्यतन करने दें।

आइए हम एक ही कार्य को एंगुलर 8 में बिल्ट-इन लाइब्रेरी और साथ ही अन्य मॉड्यूल का उपयोग करके करें।



संपत्ति सिंटैक्स का उपयोग कर शैली, यह पाठ नारंगी है

वाक्यविन्यास {संपत्ति} का उपयोग करें और कुशलता से किसी भी कोड को प्राप्त करें और इसमें लगभग तुरंत बदलाव करें।

उपरोक्त उदाहरण में, हमने जो किया है वह सीधे div तत्व शैली की संपत्ति तक पहुँचा है। DOM ऑब्जेक्ट और विशेषता पर गुणों की तुलना में, यह अलग है।

कैसे एक इंजीनियर बनने के लिए

इन-बिल्ट एंगुलर 8 विशेषताओं का उपयोग करके, हम अपनी पसंद के किसी भी वर्ग में सीएसएस तत्वों को जोड़ सकते हैं। इसे बेहतर समझने के लिए नीचे दिया गया उदाहरण देखें।



संपत्ति सिंटैक्स का उपयोग कर सीएसएस वर्ग, यह पाठ नीला है

NgClass और NgStyle को कोणीय 8 में

यह AngSular 8 में ngSyntax और ngClass दोनों के साथ बनाया गया है और इनका उपयोग विभिन्न उद्देश्यों के लिए किया जा सकता है। एक तरह से इन-बिल्ट मॉड्यूल दूसरों की तुलना में अधिक जटिल तारों में परिवर्तन लागू करने के लिए चीनी प्रदान करते हैं। आइए हम कोणीय 8 में ngStyle के सिंटैक्स पर एक नज़र डालें।

शैली का उपयोग करना

उपरोक्त उदाहरण में हमने अपनी कक्षा में कई तत्वों की गतिशीलता को बदलने के लिए Angular में ngStyle का उपयोग किया है, जबकि एक ही समूह में कई तत्वों को एक साथ रखा जाता है ताकि उपयोगकर्ता को उसकी ज़रूरत के अनुसार वर्ग को अनुकूलित करने की सुविधा मिल सके।

उपरोक्त उदाहरण की निरंतरता।

कैसे खिड़कियों पर ग्रहण चलाने के लिए
शैली का उपयोग कर शैली + -

अब जब आप ngStyle के बारे में जानते हैं, तो चलो ngStyle के कुछ तत्वों को देखें।

कक्षाओं की कक्षा की सरणी कक्षाओं की वस्तु

एनग्यूलर में ngClass हमारे तरीकों के ढेरों में हमारे कोड में बदलाव करने की भी अनुमति देता है ताकि गतिशील बदलावों को एक पल में लागू किया जा सके, बहुत कुछ ngStyle की तरह।

नीचे दिए गए उदाहरण पर एक नज़र डालें, दोनों को एक साथ कार्रवाई में देखने के लिए।

आयात {Component} '@ angular / core' @Component ({चयनकर्ता: 'my-app', templateUrl: './app.component.html', styleUrls: ['./app.component.css']}) से। निर्यात वर्ग AppComponent {color = 'pink' size = 16 displayText = 'show-class' दृश्यमान = सच्चा निर्माणकर्ता () {} toggle () {this.v अदृश्य =! यह अदृश्य। displayText = यह। अदृश्य? 'शो-क्लास': 'हाईड-क्लास'}}

कोणीय 8 में NgClick

अब जब आप ngClass और ngStyle दोनों की बुनियादी विशेषताओं को जानते हैं और कोणीय 8 प्लेटफ़ॉर्म में दोनों में से किसी एक का उपयोग करके क्या हासिल किया जा सकता है, तो आइए ngClick के उपयोग पर नज़र डालते हैं।

अजगर में प्रारूप क्या करता है

NgClick क्या है?

यदि किसी विशेष घटना में आपको एक कार्यक्रम के कई तत्वों को एक साथ बांधने की आवश्यकता होती है, ताकि एक ही कार्य प्राप्त किया जा सके, तो आपको ngClick का उपयोग करने की आवश्यकता है।

 

ऊपर का एक उदाहरण है कि कैसे एनग्लिक का उपयोग AngularJS में किया जाता है। जब यह Angular8 की बात आती है, तो समान मॉड्यूल मौजूद नहीं होता है, और इस प्रकार एक को निम्नलिखित का उपयोग करने की आवश्यकता होती है।

 

उपरोक्त सिंटैक्स का उपयोग Angular8 में ईवेंट बाइंडिंग को सुविधाजनक बनाने के लिए किया जाता है, जिसमें हम पहले कोष्ठकों के साथ लक्ष्य ईवेंट के नाम को परिभाषित करते हैं और फिर एक टेम्प्लेट स्टेटमेंट को कोटेशन के साथ-साथ बराबर ऑपरेटर को भी शामिल करते हैं। इन चरणों को पूरा करने के बाद, Angular8 इस ईवेंट के लिए एक इवेंट हैंडलर सेट करता है और जब भी ट्रिगर होता है, तो इस ईवेंट को निष्पादित किया जाता है।

Angular8 न केवल सबसे लोकप्रिय प्रोग्रामिंग भाषाओं में से एक है, बल्कि यह सबसे गतिशील में से एक है, इसकी विस्तृत सरणी के लिए धन्यवाद। इसके साथ, हम कोणीय में NgStyle पर इस लेख के अंत में आते हैं। मुझे उम्मीद है कि आपको ये समझ में आ गया होगा कि ये कैसे काम करते हैं।

इसकी जाँच पड़ताल करो Edureka द्वारा। कोणीय एक जावास्क्रिप्ट ढांचा है जो स्केलेबल, एंटरप्राइज़ और प्रदर्शन क्लाइंट-साइड वेब एप्लिकेशन बनाने के लिए उपयोग किया जाता है। कोणीय फ्रेमवर्क अपनाने के उच्च होने के कारण, एप्लिकेशन का प्रदर्शन प्रबंधन समुदाय द्वारा संचालित अप्रत्यक्ष रूप से बेहतर रोजगार के अवसर प्रदान करता है। एंगुलर सर्टिफिकेशन ट्रेनिंग का उद्देश्य एंटरप्राइज एप्लिकेशन डेवलपमेंट के आसपास इन सभी नई अवधारणाओं को कवर करना है।