कोणीय 2 - हैंडलिंग इवेंट
कोणीय 2 में, बटन क्लिक या किसी अन्य प्रकार की घटनाओं को भी बहुत आसानी से नियंत्रित किया जा सकता है। घटनाओं को HTML पृष्ठ से ट्रिगर किया जाता है और आगे की प्रक्रिया के लिए कोणीय जेएस वर्ग में भेजा जाता है।
आइए एक उदाहरण देखें कि हम इवेंट हैंडलिंग कैसे प्राप्त कर सकते हैं। हमारे उदाहरण में, हम एक क्लिक बटन और एक स्थिति गुण प्रदर्शित करेंगे। प्रारंभ में, स्थिति संपत्ति सही होगी। जब बटन पर क्लिक किया जाता है, तो स्थिति संपत्ति झूठी हो जाएगी।
Step 1 - app.component.ts फ़ाइल के कोड को निम्न में बदलें।
import {
Component
} from '@angular/core';
@Component ({
selector: 'my-app',
templateUrl: 'app/app.component.html'
})
export class AppComponent {
Status: boolean = true;
clicked(event) {
this.Status = false;
}
}
उपरोक्त कोड के बारे में निम्नलिखित बातों पर ध्यान देने की आवश्यकता है।
हम एक चर को बुलियन की स्थिति के रूप में परिभाषित कर रहे हैं जो शुरू में सच है।
अगला, हम क्लिक किए गए फ़ंक्शन को परिभाषित कर रहे हैं जिसे तब भी कहा जाएगा जब हमारे HTML पृष्ठ पर हमारे बटन पर क्लिक किया जाएगा। फ़ंक्शन में, हम स्थिति गुण के मान को सही से गलत में बदलते हैं।
Step 2 - ऐप / app.component.html फ़ाइल में निम्नलिखित परिवर्तन करें, जो टेम्पलेट फ़ाइल है।
<div>
{{Status}}
<button (click) = "clicked()">Click</button>
</div>
उपरोक्त कोड के बारे में निम्नलिखित बातों पर ध्यान देने की आवश्यकता है।
हम सबसे पहले अपनी कक्षा की स्थिति संपत्ति का मूल्य प्रदर्शित कर रहे हैं।
फिर क्लिक के मूल्य के साथ बटन HTML टैग को परिभाषित कर रहे हैं। फिर हम यह सुनिश्चित करते हैं कि बटन का क्लिक इवेंट हमारी कक्षा में क्लिक की गई घटना से चालू हो जाए।
Step 3 - सभी कोड परिवर्तन सहेजें और ब्राउज़र को रीफ्रेश करें, आपको निम्न आउटपुट मिलेगा।
Step 4 - क्लिक बटन पर क्लिक करें, आपको निम्न आउटपुट मिलेगा।