क्लिक चेक पर angular2 टेम्पलेट div तत्व वर्ग

Question

है अगर मैं वर्तमान में कुछ तर्क है कि मैं पर केवल एचटीएमएल टेम्पलेट का उपयोग कर यदि संभव हो तो सरल करने के लिए करना चाहते हैं (क्लिक करें)

मैं एक खुलने और बंधनेवाला div जो क्लिक करने के लिए है, हो जाता है " सक्रिय "

वर्तमान में मेरे div है:

<div class="collapsible-header blue darken-2" (click)="getDataForTable($event)"> 

मैं तो तत्व पर वर्गों की सूची के लिए जाँच कर रहा हूँ

function getDataForTable($event: any){ 
    let classList = $event.target.classList; 

    if(classList.contains("active")){ 
    //do nothing div is closing 
    } else { 
    //get data for table since we are opening the div to show the body 
    } 
} 

मुझे यह (click) कार्रवाई केवल आग लगाना है यदि कक्षा "सक्रिय" (जिसका मतलब है "सक्रिय" के रूप में क्लिक नहीं किया जाता है);

मैं इसे टेम्पलेट सिंटैक्स के साथ कैसे कर सकता हूं?

Answer 1

आप इस तरह यह करने के लिए सक्षम होना चाहिए:

<div class="collapsible-header blue darken-2" 
    (click)="$event.target.classList.contains('active') || getDataForTable($event)"> 

और फिर समारोह में आप जोड़ना वर्ग की जरूरत है सिर्फ होगा:

function getDataForTable($event: any) { 
    $event.target.classList.add('active'); 
    // get data for table since we are opening the div to show the body 
} 

Answer 2

<div #mydiv 
    class="collapsible-header blue darken-2"  
    (click)="mydiv.classList.contains('xxx') ? getDataForTable($event) : null">