คำถามติดแท็ก handlebars.js

มีวิธีใดบ้างในแฮนด์บาร์ JS เพื่อรวมตัวดำเนินการเชิงตรรกะเข้ากับตัวดำเนินการตามเงื่อนไขมาตรฐานของแฮนด์บาร์? บางสิ่งเช่นนี้ {{#if section1 || section2}} .. content {{/if}} ฉันรู้ว่าฉันสามารถเขียนผู้ช่วยของตัวเองได้ แต่ก่อนอื่นฉันต้องแน่ใจว่าฉันไม่ได้คิดค้นล้อใหม่

479 javascript  handlebars.js 

ความแตกต่างที่สำคัญที่ฉันเห็นคือ: แฮนด์เพิ่ม#if, #unless, #withและ#each แฮนด์บาร์เพิ่มผู้ช่วย แม่แบบแฮนด์บาร์รวบรวม (หนวดอาจเกินไป) แฮนด์สนับสนุนเส้นทาง อนุญาตให้ใช้{{this}}ในบล็อก (ซึ่งส่งออกค่าสตริงของรายการปัจจุบัน) Handlebars.SafeString() (และอาจมีวิธีอื่น ๆ ) แฮนด์บาร์เร็วขึ้น 2 ถึง 7 เท่า หนวดสนับสนุนส่วนกลับหัว (เช่นif !x ...) (โปรดแก้ไขให้ฉันด้วยถ้าผิดกับข้างต้น) มีความแตกต่างที่สำคัญอื่น ๆ ที่ฉันหายไปหรือไม่?

333 handlebars.js  mustache  client-side-templating  templating-engine 

ฉันพยายามระบุดัชนีของรายการในอาร์เรย์ภายในแม่แบบแฮนด์บาร์: { people: [ {"name":"Yehuda Katz"}, {"name":"Luke"}, {"name":"Naomi"} ] } ใช้สิ่งนี้: <ul id="luke_should_be_here"> {{people[1].name}} </ul> หากเป็นไปไม่ได้ฉันจะเขียนผู้ช่วยที่สามารถเข้าถึงรายการ spefic ภายในอาร์เรย์ได้อย่างไร

270 javascript  handlebars.js 

ฉันกำลังใช้แฮนด์บาร์สำหรับทำเทมเพลตในโครงการของฉัน มีวิธีรับดัชนีการวนซ้ำปัจจุบันของผู้ช่วยเหลือ "แต่ละคน" ในแฮนด์บาร์หรือไม่? <tbody> {{#each item}} <tr> <td><!--HOW TO GET ARRAY INDEX HERE?--></td> <td>{{this.key}}</td> <td>{{this.value}}</td> </tr> {{/each}} </tbody>

267 javascript  handlebars.js 

ฉันกำลังใช้ Handlebars.js สำหรับการแสดงภาพด้านข้างลูกค้า ถ้าอื่นทำงานได้ดี แต่ฉันได้พบกับเงื่อนไขแบบ 3 ทางที่ต้องใช้ ELSE IF: สิ่งนี้ใช้ไม่ได้: {{#if FriendStatus.IsFriend }} <div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div> {{else if FriendStatus.FriendRequested}} <div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div> {{else}} <div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div> {{/if}} ฉันจะทำอย่างไรหากใช้แฮนด์บาร์

241 handlebars.js 

ตามที่ชื่อของคำถามบอกว่ามีหนวด / มือจับวิธีการวนลูปผ่านคุณสมบัติของวัตถุหรือไม่ ดังนั้นด้วย var o = { bob : 'For sure', roger: 'Unknown', donkey: 'What an ass' } ฉันสามารถทำบางสิ่งในแม่แบบเอ็นจิ้นที่จะเทียบเท่าได้หรือไม่ for(var prop in o) { // with say, prop a variable in the template and value the property value } ?

216 javascript  handlebars.js  mustache 

พิจารณาข้อมูลที่เรียบง่ายดังต่อไปนี้: var viewData = { itemSize: 20, items: [ 'Zimbabwe', 'dog', 'falafel' ] }; และแม่แบบ Handlebars: {{#each items}} <div style="font-size:{{itemSize}}px">{{this}}</div> {{/each}} สิ่งนี้จะไม่ทำงานเพราะภายในeachลูปขอบเขตของพาเรนต์ไม่สามารถเข้าถึงได้ - อย่างน้อยก็ไม่ได้ในวิธีที่ฉันได้ลอง ฉันหวังว่าจะมีวิธีการทำเช่นนี้!

204 javascript  handlebars.js 

ฉันมีแม่แบบ handlebars.js แบบนี้: {{externalValue}} <select name="test"> {{#each myCollection}} <option value="{{id}}">{{title}} {{externalValue}}</option> {{/each}} </select> และนี่คือผลลัพธ์ที่สร้างขึ้น: myExternalValue <select name="test"> <option value="1">First element </option> <option value="2">Second element </option> <option value="3">Third element </option> </select> ตามที่คาดไว้ฉันสามารถเข้าถึงidและtitleฟิลด์ของทุกองค์ประกอบของmyCollectionเพื่อสร้างตัวเลือกของฉัน และนอกการเลือกexternalValueตัวแปรของฉันจะถูกพิมพ์อย่างถูกต้อง ("myExternalValue") น่าเสียดายที่ในตัวเลือก 'ข้อความexternalValueค่าจะไม่ถูกพิมพ์ออกมา คำถามของฉันคือฉันจะเข้าถึงตัวแปรนอกขอบเขตของแฮนด์บาร์แต่ละอันจากภายในลูปได้อย่างไร

188 javascript  templates  scope  each  handlebars.js 

ฉันมีคำสั่งเช่นนี้: {{#if IsValid}} ฉันต้องการทราบว่าฉันสามารถใช้ifคำสั่งเชิงลบที่จะมีลักษณะเช่นนั้น: {{#if not IsValid}}

179 ember.js  handlebars.js 

ฉันกำลังเรียนรู้ ember.js และฉันพยายามเข้าใจความแตกต่างระหว่างมุมมองและองค์ประกอบ ฉันเห็นว่าทั้งสองเป็นวิธีในการสร้างส่วนประกอบที่ใช้ซ้ำได้ จากเว็บไซต์ของ Ember ในมุมมอง: มุมมองใน Ember.js โดยทั่วไปแล้วจะถูกสร้างขึ้นด้วยเหตุผลดังต่อไปนี้: - เมื่อคุณต้องการการจัดการเหตุการณ์ผู้ใช้ที่ซับซ้อน - เมื่อคุณต้องการสร้างองค์ประกอบที่ใช้งานได้อีกครั้ง จากเว็บไซต์ของ Ember เกี่ยวกับส่วนประกอบ: ส่วนประกอบคือแท็ก HTML ที่กำหนดเองซึ่งมีพฤติกรรมที่คุณใช้งานโดยใช้ JavaScript และมีลักษณะที่คุณอธิบายโดยใช้เทมเพลต Handlebars ช่วยให้คุณสร้างตัวควบคุมที่สามารถนำมาใช้ซ้ำได้ซึ่งจะทำให้แม่แบบของแอปพลิเคชันของคุณง่ายขึ้น ดังนั้นความแตกต่างที่สำคัญระหว่างมุมมองและองค์ประกอบคืออะไร? และจะเป็นตัวอย่างทั่วไปที่ฉันต้องการใช้มุมมองมากกว่าองค์ประกอบและในทางกลับกันคืออะไร

143 javascript  ember.js  handlebars.js 

มีวิธีแทรกสตริงที่มีแท็ก html ในเทมเพลตแฮนด์บาร์โดยไม่ได้รับแท็กที่หลบหนีในสตริงขาออกหรือไม่? template.js: <p>{{content}}</p> ใช้เทมเพลต HBS.template({content: "<i>test</i> 123"}) ผลลัพธ์ที่แท้จริง: <p><i>test</i> 123</p> ผลลัพธ์ที่คาดหวัง: <p><i>test</i> 123</p>

143 javascript  handlebars.js 

ฉันใช้ Handlebar.js เป็นเครื่องมือสร้างเทมเพลต ตอนนี้ฉันต้องการแสดงความคิดเห็นเกี่ยวกับบล็อกบางส่วนในเทมเพลตแฮนเดิลบาร์ของฉัน แต่แล้วฉันก็รู้ว่า Handlebar ไม่ได้เพิกเฉยต่อการแสดงออกในบล็อกความคิดเห็นของ Handlebar วิธีแก้ปัญหาสำหรับสิ่งนี้หรือไม่?

137 javascript  html  templates  handlebars.js 

ฉันกำลังจัดการกับ handlebars.js ในแอปพลิเคชัน express.js เพื่อให้สิ่งต่างๆเป็นโมดูลาร์ฉันแบ่งเทมเพลตทั้งหมดออกเป็นบางส่วน ปัญหาของฉัน : ฉันไม่พบวิธีส่งผ่านตัวแปรผ่านการเรียกใช้บางส่วน สมมติว่าฉันมีบางส่วนซึ่งมีลักษณะดังนี้: <div id=myPartial> <h1>Headline<h1> <p>Lorem ipsum</p> </div> สมมติว่าฉันลงทะเบียนบางส่วนนี้ด้วยชื่อ 'myPartial' ในเทมเพลตอื่นฉันสามารถพูดว่า: <section> {{> myPartial}} </section> ใช้งานได้ดีบางส่วนจะแสดงผลตามที่คาดไว้และฉันเป็นนักพัฒนาที่มีความสุข แต่สิ่งที่ฉันต้องการตอนนี้คือวิธีส่งผ่านตัวแปรที่แตกต่างกันผ่านการเรียกนี้เพื่อตรวจสอบภายในบางส่วนเช่นระบุบรรทัดแรกหรือไม่ สิ่งที่ต้องการ: <div id=myPartial> {{#if headline}} <h1>{{headline}}</h1> {{/if}} <p>Lorem Ipsum</p> </div> และการเรียกใช้ควรมีลักษณะดังนี้: <section> {{> myPartial|'headline':'Headline'}} </section> หรือไม่ก็. ฉันรู้ว่าฉันสามารถกำหนดข้อมูลทั้งหมดที่ต้องการได้ก่อนที่จะสร้างเทมเพลต แต่ฉันต้องการวิธีทำเหมือนที่เพิ่งอธิบาย มีทางเป็นไปได้ไหม

131 javascript  html  handlebars.js  templating 

มีวิธีในเทมเพลต Handlebars.js เพื่อตรวจสอบว่าคอลเล็กชันหรือรายการเป็นโมฆะหรือว่างเปล่าก่อนที่จะไปและวนซ้ำตามรายการ / คอลเลกชันหรือไม่ // if list is empty do some rendering ... otherwise do the normal {{#list items}} {{/list}} {{#each items}} {{/each}}

122 handlebars.js 

ฉันเป็นคนใหม่ (ish) สำหรับแอปพลิเคชั่นสแต็กเต็มรูปแบบของจาวาสคริปต์และยังใหม่สำหรับ Angular ดังนั้นฉันหวังว่าจะมีใครสักคนสามารถใส่บันทึกให้ฉันได้ที่นี่ เหตุใดฉันจึงต้องใช้เฟรมเวิร์กเทมเพลตเช่น Jade หรือ Handlebars เมื่อเขียนแอพฝั่งไคลเอ็นต์โดยใช้ AngularJS ฉันควรจะบอกว่าฉันไม่เคยใช้เฟรมเวิร์กเทมเพลตเหล่านี้เลย ดังนั้นฉันจึงไม่คุ้นเคยกับข้อดีอย่างสมบูรณ์ แต่เมื่อฉันดูที่ Handlebars มันจะทำหลายอย่างเช่นเดียวกับที่ฉันทำใน Angular เช่นการวนซ้ำเป็นต้น เท่าที่ฉันสามารถบอกได้มันสมเหตุสมผลที่สุดที่จะสร้างเทมเพลตใน Angular โดยใช้ HTML ที่เหมาะสมจากนั้นทำการเทมเพลตฝั่งไคลเอ็นต์ทั้งหมดและรวมสิ่งนี้เข้ากับแนวทางแรกของ API โดยใช้ node และ mongo เป็นต้น สาเหตุของความสับสนนี้คือตัวอย่างจำนวนมากที่ฉันพบใน GitHub ใช้ประโยชน์จาก Jade และดูเหมือนว่าจะใช้งานง่ายสำหรับฉัน โปรดสอนฉันและตั้งฉันให้ตรง ฉันชอบที่จะเรียนรู้แนวทางปฏิบัติที่ดีที่สุดจากผู้ที่รู้จักมากกว่าที่ฉันทำ ขอบคุณ

120 node.js  mongodb  angularjs  handlebars.js  pug