Truyền dữ liệu vào setter của component con trong Angular
Chúng ta có thể thực hiện để dữ liệu từ component cha được đưa vào setter của một thuộc tính private. Hãy xem xét ví dụ. Giả sử chúng ta có một thuộc tính private với setter và getter:
class UserComponent {
private _name: string = '';
set name(name: string) {
if (name.length < 3) {
this._name = name;
} else {
console.log('error');
}
}
get age() {
return this._userAge;
}
}
Để làm ví dụ, hãy tạo một setter cho tuổi, trong đó triển khai kiểm tra dữ liệu được truyền vào. Cũng tạo một getter để xuất các thuộc tính của người dùng:
class UserComponent {
private _name: string = '';
@Input()
set name(name: string) {
if (name.length > 3) {
this._name = name;
} else {
console.log('error');
}
}
get name() {
return this._name;
}
}
Bây giờ hãy truyền dữ liệu từ component cha vào component con:
<user-data name="john"></user-data>
Và trong component con, hiển thị tên đã được truyền ra màn hình:
<p>{{ name }}</p>
Hãy giải thích tại sao thuộc tính private _name
lại bắt đầu bằng ký tự gạch dưới.
Hãy triển khai setter và getter cho tên sản phẩm và giá của nó, những thứ sẽ được truyền từ component cha.