एंजुलर 2

Question

के साथ सामग्री को सीएसएस छद्म-तत्व 'पहले' भरें गतिशील रूप से :before छद्म-तत्व पर गतिशील रूप से 'सामग्री' मान को भरने का प्रयास करने में मुझे कठिन समय हो रहा है। मुझे पता चला गया है यह here पर एक और सवाल में AngularJS के पिछले संस्करणों पर संभव हो गया था, तत्व उस पर before -pseudo तत्व है कि पर एक अतिरिक्त डेटा विशेषता बनाने के द्वारा, और फिर सीएसएस में attr() का उपयोग कर कि मूल्य पढ़ें।

यह ठीक काम करने के लिए जब एक मूल्य के रूप में एक सादे स्ट्रिंग का उपयोग लगता है:

// CSS 
.test:before { 
    content: attr(data-before); 
} 

// Template 
<div class="test" data-before="{{name}}"> 
    <h2>Hello {{name}}</h2> 
</div> 

:

// CSS 
.test:before { 
    content: attr(data-before); 
} 

// Template 
<div class="test" data-before="before text goes here"> 
    <h2>Hello {{name}}</h2> 
</div> 

लेकिन जब मैं इस तरह प्रक्षेप के साथ डेटा से पहले भरने के लिए प्रयास करते हैं, मैं कोई त्रुटि मिलती है

मुझे यहां क्या याद आ रही है? उत्पन्न त्रुटि है:

Error: Template parse errors: 
Can't bind to 'before' since it isn't a known property of 'div'. 

यहाँ plunker में गैर काम संस्करण है: http://plnkr.co/edit/HwVp9jlsx6uKfoRduxWu

Answer 1

उपयोग: <div class="test" [attr.data-before]="[name]">

अद्यतन

आप, साथ ही ड्रॉप कर सकते हैं चारों ओर वर्ग कोष्ठक name इस तरह:

।

यह देखे जाने वाले कई उदाहरणों में यह सम्मेलन प्रतीत होता है। यह काम करता है, मुझे लगता है, क्योंकि आप पहले ही [attr.data-before] निर्दिष्ट करके बाध्यकारी करने के लिए कोणीय को बता रहे हैं, और यह मानता है कि दाईं ओर डेटा संबंधित घटक से आ रहा है।