javascript - แทรก html ในเทมเพลตแฮนด์บาร์โดยไม่ต้องหลบหนี
มีวิธีใดบ้างที่จะใส่สตริงที่มีแท็ก HTML ลงในเทมเพลต Handlebars โดยไม่ให้แท็กถูกแปลงอักขระเมื่อได้สตริงออกมา?
template.js:
<p>{{content}}</p>
ใช้เทมเพลต
HBS.template({content: "<i>test</i> 123"})
ผลลัพธ์ที่แท้จริง:
<p><i>test</i> 123</p>
ผลลัพธ์ที่คาดหวัง:
<p><i>test</i> 123</p>
คำตอบ #1
ลองเหมือน
<p>{{{content}}}</p>
อ้างอิงอย่างเป็นทางการ:
Handlebars ทำการแปลงตัวอักษรพิเศษของ HTML ของค่าที่ส่งกลับโดย
{{expression}}. ถ้าคุณไม่ต้องการให้ Handlebars แปลงค่า ให้ใช้ "triple-stash"{{{.
คำตอบ #2
ในเทมเพลตของคุณคุณต้องเพิ่มเครื่องหมายปีกกาแบบสามชั้นแบบนี้ <p>{{{content}}}</p>
ดูเอกสารอ้างอิงอย่างเป็นทางการเพื่อข้อมูลเพิ่มเติมเกี่ยวกับเรื่องนั้น
คำตอบ #3
ตามเอกสารของ Handlebars:
ถ้าคุณไม่ต้องการให้ Handlebars แปลงค่าหนึ่ง ให้ใช้ "triple-stash"
{{{
ส่ง HTML ดิบไปยังเทมเพลต Handlebars และรับเอาต์พุต HTML ดิบโดยใช้เครื่องหมายวงเล็บสามชั้น
{{{foo}}}