handlebars.js - Simplest way to add one class or another -

-

हैंडलबार के साथ, एक {{# #] द्वारा प्रदान किए जाने वाले प्रत्येक तत्व को एक वर्ग या दूसरे को जोड़ने का सबसे सरल तरीका क्या है? प्रत्येक ...}} सहायक? मुझे साइट के लिए एक मौजूदा सीएसएस सेटअप के साथ एकीकृत करना होगा, जिसके लिए एक वर्ग या दूसरे को एक सूची में वैकल्पिक तत्वों को जोड़ने की आवश्यकता है।

उदाहरण सहायक: 

  {{# प्रत्येक आइटम}} & lt; div class = "{{यहाँ क्या है?}}" & Gt; ... & lt; / div & gt; {{/ प्रत्येक}

... जहां हम वर्ग के नाम के रूप में भी या अजीब चाहते हैं (हां, फिर, मुझे पता है कि यह सीएसएस के साथ किया जा सकता है; मैं एक मौजूदा साइट के सीएसएस के साथ एकीकरण कर रहा हूं जो इसके बजाय वैकल्पिक कक्षाओं का उपयोग करता है।)

< डिवा क्लास = "पोस्ट-टेक्स्ट" आइटमप्रॉप = "टेक्स्ट">

एक हैंडलेबर्स नौसिख के रूप में, मैं कुछ भी अंतर्निहित नहीं देख रहा हूं, लेकिन एपीआई एक सहायक को जोड़ने में आसान बनाता है जो आपको एक मनमानी से चयन करने देता है - आइटम की लम्बाई सूची, इस तरह: 

  हैंडलबार। रजिस्टरहाल्पर ('चक्र', फ़ंक्शन (इंडेक्स) {अनुक्रमणिका = अनुक्रमणिका% (arguments.length - 2); // 2 छोड़ने के लिए `इंडेक्स 'और अंतिम तर्क एचबी में वापसी तर्क जोड़ता है [सूचकांक 1];});

इसका प्रयोग करना होगा: 

  {{# प्रत्येक आइटम}} & lt; div class = "{{cycle @index 'even' 'अजीब '}} "& gt; ... & lt; / div & gt; {{/ प्रत्येक}  

  हैंडलबार। रजििस्टरहाल्पर ('चक्र', फ़ंक्शन (इंडेक्स) {अनुक्रमणिका = अनुक्रमणिका% (तर्क। लांघ - 2); / / -2 'सूचकांक' और अंतिम तर्क छोड़ने के लिए एचबी वापसी तर्क जोड़ता है [सूचकांक 1];}); Var आइटम = ["एक", "दो", "तीन", "चार", "पाँच"]; Var टेम्पलेट = हैंडलेबर्स.कॉइल (document.getElementById ("टेम्पलेट")। InnerHTML); Var html = टेम्पलेट ({आइटम: आइटम}); Document.body.insertAdjacentHTML ("पहले", html);  
  .even {color: blue; } .odd {color: green; }  
  & lt; script src = "// cdnjs.cloudflare.com/ajax/libs/handlebars जे एस / 2.0.0 / handlebars.min.js "& gt; & lt; / स्क्रिप्ट & gt; & Lt; स्क्रिप्ट id = "template" type = "text / x-handlebars-template" & gt; {{#each आइटम}} & lt; div class = "{{cycle @index 'भी' 'अजीब'}}" & gt; {{this}} & lt; / div & gt; या यदि मैं रोटेशन में तीन कक्षाएं चाहता / चाहती हूं:  
    {{# प्रत्येक आइटम}} & lt; div class = "{{cycle @index 'one' 'दो' 'तीन'}}" & gt; ... & lt; / div & gt; {{/ प्रत्येक}  
 
 
 
 
  हैंडलबार। रजििस्टरहाल्पर ('चक्र', फ़ंक्शन (इंडेक्स) {अनुक्रमणिका = अनुक्रमणिका% (तर्क। लांघ - 2); / / -2 'सूचकांक' और अंतिम तर्क छोड़ने के लिए एचबी वापसी तर्क जोड़ता है [सूचकांक 1];}); Var आइटम = ["एक", "दो", "तीन", "चार", "पाँच"]; Var टेम्पलेट = हैंडलेबर्स.कॉइल (document.getElementById ("टेम्पलेट")। InnerHTML); Var html = टेम्पलेट ({आइटम: आइटम}); Document.body.insertAdjacentHTML ("पहले", html);  
 
  .one {color: blue; }। दो {रंग: हरा; }। तीन {रंग: लाल; }  
 
  & lt; script src = "// cdnjs.cloudflare.com/ajax/libs/handlebars जे एस / 2.0.0 / handlebars.min.js "& gt; & lt; / स्क्रिप्ट & gt; & Lt; स्क्रिप्ट id = "template" type = "text / x-handlebars-template" & gt; {{#each आइटम}} & lt; div class = "{{cycle @index 'एक' 'दो' 'तीन'}}" & gt; {{this}} & lt; / div & gt; {{/ Each}}

Comments

Post a Comment

Popular posts from this blog

c# - SignalR: "Protocol error: Unknown transport." when navigating to hub -

-
Image
I am trying to use the ASP.NET signal for the first time - here's what I did: created a new web Has been added to the project and the following signal R packages: I have created the following category: [Hub-name ("chat")] Public class ChatHub: Hub {Public Zero Halo () {Clients.All.hello ( ); }} and the following startup configuration: public partial class startup {public zero configuration (IAppBuilder app) {configure (app); App.MapSignalR (); }} However, whenever I navigate localhost: (port) / api / signalr / chat I get the following error: Protocol error: Unknown transport. I am running a new browser and trying different people so remove it from the API / URL, and just use the localhost: (potter) / signaller / Chat
Read more

Camel ProducerTemplate possible memory leak -

-
To some degree, this is a bit of a shot in the dark, but we have a process that is dramatically slow One day's course we have found that all the things running on the fuses begin to draw, but when we are running a specific process, JPPropellers are going on, I have found that the increase in magnetic usage increases over time. . Org.apache.camel.ProductTemplate.Send So my main question is, is the way in which the manufacturer product is being used here which is wrong / can this be a problem? exchange foo = new DefaultExchange (getCamelContext (), ExchangePattern.InOnly); Foo.getIn () setBody (obj). Root R = Exchange .getContext (). GetRoute ("do_something_fun"); Creator Template Template = exchange.getContext () CreateProducerTemplate (); Template.send (r.getEndpoint (), foo); Generally, you should not create a productive template on each request as described here: / P> However, because I do not have a complete picture of your application, so you can cr...
Read more

javascript - Adhering to a max length setting with jshint -

-
I get several recommendations to compile a maximum of 80 characters when writing javascript, e.g. Google, NPM, Node. JS, Crockford In some cases, though, I do not think how best to do this. MongoClient.connect ('mongodb: // localhost: 27017 / sampleDatabase', function (mistake, database) {if (err)} {throw error;} db = database;}); This will throw a jshint warning because it exceeds 80 characters. Now, do you choose to ignore the warning in this example, or instead choose an option for a solution like MongoClient.connect ('mongodb: // localhost: 27017 / sampleDatabase' , Function (err, database) {if (err) {throw error;} db = database;}); If you can reuse the url variable So, great option if this is a shot, as is often such a call, I would probably do something like this ... / * jslint sloppy: true, white: true, browser: True, maxlen: 80 * / / * global mongo client * / var dbarhh, db; DbErrHand = function (mistake, database) {if (err) {throw error; } ...
Read more