เข้าถึงตัวแปรที่อยู่นอกขอบเขตของ Handlebars.js แต่ละลูป


188

ฉันมีแม่แบบ 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ค่าจะไม่ถูกพิมพ์ออกมา

คำถามของฉันคือฉันจะเข้าถึงตัวแปรนอกขอบเขตของแฮนด์บาร์แต่ละอันจากภายในลูปได้อย่างไร

คำตอบ:


454

ลอง

<option value="{{id}}">{{title}} {{../externalValue}}</option>

ส่วนของ../เส้นทางอ้างอิงขอบเขตขอบเขตแม่แบบที่ควรเป็นสิ่งที่คุณต้องการ


10
หากผู้อ่านในอนาคตยังคงมีปัญหาเหมือนฉันให้ดูความคิดเห็นสำหรับคำตอบนี้ที่นี่ ฉันใช้เวลาสักพักหลังจากเห็นคำตอบนี้เพื่อดูคำตอบนั้น คุณอาจจำเป็นต้องใช้../ซ้ำ ๆ ทั้งนี้ขึ้นอยู่กับจำนวนขอบเขตที่อยู่ห่างจากค่าที่คุณเป็น
bcmcfc

10
ฉันเป็นบ้าหรือเป็นข้อมูลที่มีค่าชนิดนี้ไม่พบในแฮนด์บาร์เอกสารหรือไม่?
เจสซี

1
@spliter จะทำงานในแฮนด์ Ember .. มันดูเหมือนจะไม่ได้ร่วมงาน
kweku360

1
ไม่มีความคิด @ kweku360 มันใช้งานได้กับฮาเดลบาร์ปกติ อาจเป็นได้ว่า Ember ใช้มือจับรุ่นที่ปรับแต่งแล้วซึ่งฟังก์ชันนี้ถูกใช้งานด้วยวิธีการอื่น
spliter

1
ขอบคุณคนนี้ใช้ได้ดีกับมูลนิธิ 6 Panini
Marco

13

หรือคุณสามารถใช้พา ธ สัมบูรณ์แบบนี้:

<option value="{{id}}">{{title}} {{@root.user.path.to.externalValue}}</option>

1

ฉันเห็นลิงก์จำนวนมากที่มี 404 สำหรับเอกสารประกอบเกี่ยวกับหัวข้อนี้

ฉันอัปเดตด้วยสิ่งนี้มันทำงานในวันที่ 1 เมษายน 2020 :

https://handlebarsjs.com/guide/expressions.html#path-expressions

ผู้ช่วยเหลือบางคนเช่น #with และ #each อนุญาตให้คุณดำน้ำไปยังวัตถุที่ซ้อนอยู่ เมื่อคุณรวม .. / กลุ่มในเส้นทางของคุณ Handlebars จะเปลี่ยนกลับไปเป็นบริบทหลัก

    {{#each people}}
    {{../prefix}} {{firstname}} 
    {{/each}}

แม้ว่าชื่อจะถูกพิมพ์ในขณะที่อยู่ในบริบทของความคิดเห็น แต่ก็ยังสามารถกลับไปที่บริบทหลัก (วัตถุราก) เพื่อดึงคำนำหน้า

คำเตือน

ค่าที่แน่นอนที่ ../ จะแก้ไขแตกต่างกันไปตามผู้ช่วยที่เรียกบล็อก การใช้ ../ จำเป็นสำหรับการเปลี่ยนแปลงบริบทเท่านั้น เด็ก ๆ ของผู้ช่วยเหลือเช่น {{#each}} จะต้องใช้ ../ ในขณะที่เด็ก ๆ ของผู้ช่วยเหลือเช่น {{#if}} ไม่ทำ

{{permalink}}
{{#each comments}}
  {{../permalink}}

  {{#if title}}
    {{../permalink}}
  {{/if}}
{{/each}}

ในตัวอย่างนี้การอ้างอิงทั้งหมดข้างต้นมีค่าคำนำหน้าเหมือนกันแม้ว่าจะอยู่ภายในบล็อกที่แตกต่างกัน ลักษณะการทำงานนี้เป็นสิ่งใหม่ของ Handlebars 4 บันทึกย่อประจำรุ่นจะกล่าวถึงพฤติกรรมก่อนหน้านี้รวมถึงแผนการย้ายข้อมูล

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.