ตัวแปรเทมเพลตใน Angular
ใน Angular คุณสามารถเข้าถึงแท็กของหน้าเว็บได้โดยใช้ ตัวแปรเทมเพลต
พวกมันช่วยให้คุณผูกแท็กกับตัวแปรและอ้างอิงถึงมันได้ในระหว่างการทำงานของคอมโพเนนต์
เพื่อประกาศตัวแปรดังกล่าว คุณต้องใส่เครื่องหมาย # หน้าชื่อของมัน
มาดูกันในทางปฏิบัติ สมมติว่าเรามี div เขียนมันลงในตัวแปรเทมเพลต:
<div #userName>
text
</div>
ตอนนี้ในตัวแปร userName จะมีการเก็บลิงก์ไปยังองค์ประกอบ DOM ของ div ของเรา
และเราสามารถอ้างอิงถึงมันได้ ตามที่ทำใน JavaScript แบบ vanilla
ตัวอย่างเช่น ลองแสดงข้อความของ div นี้ในแท็กอื่น:
<div>
{{ userName.textContent }}
</div>
กำหนด div กำหนดรูปภาพ
เขียนลิงก์ไปยังรูปภาพลงในตัวแปรเทมเพลต
แสดง src ของรูปภาพของเราภายใน div
