การผูกค่ากับคุณสมบัติ DOM ขององค์ประกอบใน Angular

ใน Angular มีการแยกแยะการผูกค่ากับแท็กออกเป็นสองประเภท: การผูกกับแอตทริบิวต์ของแท็ก และการผูกกับคุณสมบัติ DOM ขององค์ประกอบ โดยปกติแล้วทั้งสองอย่างนี้คือสิ่งเดียวกัน แต่บางครั้งก็มีความแตกต่างสำคัญ

ลองมาดูสองวิธีนี้ด้วยตัวอย่างกัน สมมติว่าเรามีคุณสมบัติคลาสดังต่อไปนี้:

export class AppComponent {
	public text: string = 'abcde';
}

ลองแสดงค่าของคุณสมบัตินี้ลงในข้อความของ textarea

<textarea>{{ text }}</textarea>

และตอนนี้ลงในแอตทริบิวต์ placeholder:

<textarea placeholder="{{ text }}"></textarea>

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

<textarea [value]="text"></textarea>

กำหนดอินพุตมาให้ จงเขียนข้อมูลลงในคุณสมบัติ value ของมัน