2012-01-10 10 views
12

पहले से ही overused कार्यसूची एप्लिकेशन उदाहरण का उपयोग, मान लें कि मैं एक "TODO" वर्ग (स्थिर) के साथ एक तत्व चाहते हैं और एक "है किया" वर्ग (गतिशील):एक एम्बर.जेएस हैंडलबर्स टेम्पलेट में, स्थिर और गतिशील वर्ग दोनों गुणों का एक तरीका है?

<div {{bindAttr class="todo isDone"}}> 
    Other stuff in here 
</div> 

इस मामले में , "isDone" और "todo" दोनों को मेरी दृश्य वस्तु पर गुण होने की उम्मीद है, जो मैं "isDone" के लिए चाहता हूं, लेकिन "todo" के लिए नहीं। मैं वर्तमान में अपने विचार पर एक "todo" संपत्ति जोड़कर इस पर काम कर रहा हूं जो एक स्थिर "todo" स्ट्रिंग के बराबर है। क्या BindAttr का उपयोग करते समय स्थिर श्रेणी विशेषता रखने का कोई तरीका है?

फिडल उदाहरण: http://jsfiddle.net/nes4H/4/

उत्तर

23

संपादित करें :

हमने इसे एम्बर में तय कर लिया है!

गुरु से निर्माण पर, या के बाद 0.9.6 जारी किया गया है, अब आप कर सकते हैं:

<div {{bindAttr class="App.foo:a-bound-class :a-static-class"}}></div>


पिछला जवाब:

आप दुर्भाग्य से नहीं हो सकता bindAttr का उपयोग करते समय स्थिर और गतिशील वर्ग दोनों नाम।

मैं स्थिर और गतिशील वर्ग दोनों नामों को आउटपुट करने के लिए आपके दृश्य पर एक या अधिक गणना गुणों का उपयोग करने का सुझाव देता हूं।

स्थिर और गतिशील वर्ग दोनों नामों का समर्थन करना बहुत अच्छा होगा, लेकिन bindAttr वर्तमान में काम करता है, यह संभव नहीं है। bindAttr टेम्पलेट संकलन के दौरान संलग्न तत्व के बारे में कुछ भी नहीं जानता है।

+0

ओह। धन्यवाद। – adamlogic

+1

नई सुविधा को दर्शाने के लिए अपडेट किया गया। – ebryn

+0

अभी तक अनियंत्रित है? या क्या मुझे बस याद आती है? – dechov

3

मैं अगर तुम bindAttr साथ यह कर सकते हैं पता नहीं है, लेकिन #view सहायक आप दोनों स्थिर वर्गों और गतिशील लोगों निर्धारित करने की अनुमति देता है:

{{#view App.TodoView class="todo" classBinding="isDone"}} 
    inner content 
{{/view}} 
2

एम्बर मास्टर में, एक कॉलन तैयार करके bindAttr के भीतर स्थिर वर्गों को निर्दिष्ट करने की अनुमति देने के लिए आज एक बदलाव किया गया था।

https://github.com/emberjs/ember.js/commit/ce385e3294be019215c555511c7f393aebc02e41

यह निश्चित रूप से, अगली रिलीज से पहले बदल सकते हैं, लेकिन यह एक समस्या यह है कि एंबर कोर टीम का समाधान करना चाहता है।

0

एम्बर 1.10.0 में, bindAttr को बहिष्कृत किया गया है। आप सीधे एक चर को कक्षा के वर्ग में बाध्य कर सकते हैं। यहाँ रंग चर एक div के वर्ग के लिए बाध्य है:

<div class="{{color}}"></div> 

इनलाइन यदि सहायक भी इन संदर्भों में इस्तेमाल किया जा सकता है:

<div class="{{color}} {{if isEnabled 'active' 'disabled'}}"></div> 

http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html

संबंधित मुद्दे