आइए कहें कि मेरे पास कुछ ऐसा है:

<div (click)="toggleMe()" [class.toggled]="something"></div>
<div (click)="toggleMe()" [class.toggled]="something"></div>
<div (click)="toggleMe()" [class.toggled]="something"></div>

मैं जिस डिव पर क्लिक किया था उस पर क्लास को टॉगल करना चाहता हूं, हालांकि मैं प्रत्येक डिव के लिए कंपोनेंट में एक अलग वेरिएबल नहीं बनाना चाहता। मैं इसे कैसे हल कर सकता था?

JQuery के साथ मैं ऐसा कुछ करूंगा:

$("div").click(function() {
    $(this).toggleClass("toggled");
});

अब यह हर डिव के लिए काम करेगा, चाहे मैं कितना भी जोड़ लूं। क्या कोणीय में इसके बराबर है? शायद this संदर्भ जैसा कुछ?

1
nbar 14 फरवरी 2019, 17:28

1 उत्तर

सबसे बढ़िया उत्तर

यदि आप डिव तत्वों के लिए विशिष्ट चर नहीं बनाना चाहते हैं, तो आप HTML तत्व को संदर्भित करने के लिए click ईवेंट की event.target संपत्ति का उपयोग कर सकते हैं, और कक्षा को element.classList.toggle("toggled") के साथ टॉगल कर सकते हैं। :

<div (click)="toggleMe($event)">Div1</div>
<div (click)="toggleMe($event)">Div2</div>
<div (click)="toggleMe($event)">Div3</div>
toggleMe(event: Event) {
  const element = (event.target as HTMLElement);
  element.classList.toggle("toggled");
}

डेमो के लिए यह स्टैकब्लिट्ज देखें।

1
ConnorsFan 14 फरवरी 2019, 14:42