Aurelia - อ้างอิง

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

ตารางอ้างอิง

ซีเนียร์ No	ตัวอย่างและคำอธิบาย
1	ref = "myRef" ใช้สำหรับสร้างการอ้างอิงถึงองค์ประกอบ DOM
2	attribute-name.ref = "myRef" ใช้สำหรับสร้างการอ้างอิงไปยัง view-model ของแอตทริบิวต์ที่กำหนดเอง
3	view-model.ref = "myRef ใช้สำหรับสร้างการอ้างอิงถึงมุมมองแบบจำลองขององค์ประกอบที่กำหนดเอง
4	view.ref = "myRef" ใช้สำหรับสร้างการอ้างอิงไปยังอินสแตนซ์มุมมององค์ประกอบที่กำหนดเอง
5	rcontroller.ref = "myRef" ใช้สำหรับสร้างการอ้างอิงอินสแตนซ์ตัวควบคุมขององค์ประกอบที่กำหนดเอง

ในตัวอย่างต่อไปนี้เราจะสร้างการอ้างอิงไปยังไฟล์ inputธาตุ. เราจะใช้ไวยากรณ์ของคลาสเริ่มต้นเป็นไฟล์view-model.

app.js

export class App { }

เรากำลังสร้างข้อมูลอ้างอิงไปยังไฟล์ input องค์ประกอบโดยการเพิ่ม ref = "name" แอตทริบิวต์

app.html

<template>
   <input type = "text" ref = "name"><br/>
   <h3>${name.value}</h3>
</template>

เมื่อเราเรียกใช้แอปเราจะเห็นว่าข้อความที่ป้อนลงในช่องป้อนข้อมูลจะแสดงบนหน้าจอ