जेड इनलाइन सशर्त

Question

मैं सरणी में पहले तत्व से अलग सब कुछ बनाने की कोशिश कर रहा हूं, जेड टेम्पलेटिंग इंजन का उपयोग कर एक सीएसएस क्लास है।

मुझे उम्मीद थी कि मैं इसे ऐसा कर सकता हूं, लेकिन कोई भाग्य नहीं। कोई सुझाव?

- each sense, i in entry.senses 
    div(class="span13 #{ if (i != 0) 'offset3' }") 
    ... a tonne of subsequent stuff 

मैं जानता हूँ कि मैं के रूप में नीचे दिए गए कोड लपेट सकता है, लेकिन जहाँ तक मैं जेड के घोंसले नियमों को समझने काम करने के लिए, मैं कोड नकल या एक Mixin या कुछ और करने के लिए इसे निकालने के लिए होगा।

- each sense, i in entry.senses 
    - if (i == 0) 
    .span13 
     ... a tonne of subsequent stuff 
    - else 
    .span13.offset3 
     ... identical subsequent stuff 

क्या ऐसा करने का कोई बेहतर तरीका है?

Answer 1

आप इस के बजाय कर सकते हैं:

- each sense, i in entry.senses 
    - var klass = (i === 0 ? 'span13' : 'span13 offset3') 
    div(class=klass) 
    ... a tonne of subsequent stuff 

Answer 2

यह भी काम करता है:

div(class="#{i===0 ? 'span13' : 'span13 offset3'}") 

Answer 3

यह मेरा समाधान है। मैं वर्तमान सक्रिय पथ को पार करने के लिए एक मिश्रण का उपयोग कर रहा हूं और मिश्रण में मैं पूरा मेनू परिभाषित करता हूं और यह जांचने के लिए हमेशा पास करता हूं कि पथ सक्रिय पथ है या नहीं।

mixin adminmenu(active) 
    ul.nav.nav-list.well 
    li.nav-header Hello 
    li(class="#{active=='/admin' ? 'active' : ''}") 
     a(href="/admin") Admin 

Answer 4

यह भी काम करता है:

div(class=(i===0 ? 'span13' : 'span13 offset3')) 

Answer 5

आप उपयोग करने के लिए कर सकते हैं, न केवल class, लेकिन एक सशर्त तरह से विशेषताओं का एक गुच्छा:

- each sense, i in entry.senses 
    - var attrs = i === 0 ? {'disabled': 'true'} : {'class': '100', 'ng-model': 'vm.model.name', 'ng-click': 'vm.click()'} 
    div&attributes(attrs) 

Answer 6

मैं साधारण कार्यों का उपयोग करना पसंद करते हैं किसी भी जटिल परिस्थितियों की जांच करने के लिए। यह सही और तेज़ काम करता है, आपको टेम्पलेट में लंबी लाइनें नहीं लिखनी चाहिए। आशा है कि यह मदद करता है और विचार को समझने के लिए स्पष्ट है इस

-function resultClass(condition) 
-if (condition===0) 
    -return 'span13' 
-else if (condition===1) 
    -return 'span13 offset3' 
-else if (condition===2) //-any other cases can be implemented 
    -return 'span13 offset3' 
-else 
    -return 'span13 offset3' 

- each sense, i in entry.senses 
    div(class=resultClass(i)) 
    ... a tonne of subsequent stuff 

को यह

- each sense, i in entry.senses 
    - var klass = (i === 0 ? 'span13' : 'span13 offset3') 
    div(class=klass) 
    ... a tonne of subsequent stuff 

जगह ले सकता है।

इसके अलावा यह अच्छा फ़ाइल को शामिल में सभी कार्यों को स्थानांतरित करने के लिए और विभिन्न टेम्पलेट्स के बीच यह साझा अभ्यास है, लेकिन यह एक और सवाल है

Answer 7

बन्दर 2 के साथ आप इस वाक्य विन्यास का उपयोग कर सकते हैं:

a(href='/', class="link", class={"-active": page === 'home'}) Home page 

अधिक यहाँ: https://pugjs.org/language/attributes.html