Penghantaran Data ke Penerima (Setter) Komponen Anak dalam Angular
Kita boleh mengatur supaya data dari komponen induk masuk ke dalam penerima (setter) sifat peribadi. Mari kita lihat contohnya. Katakan kita mempunyai sifat peribadi dengan penerima (setter) dan pengambil (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;
}
}
Sebagai contoh, mari kita buat penerima (setter) untuk umur, di mana kita akan melaksanakan semakan data yang dihantar. Juga, mari buat pengambil (getter) untuk memaparkan sifat pengguna:
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;
}
}
Sekarang, mari hantar data dari komponen induk ke komponen anak:
<user-data name="john"></user-data>
Dan dalam komponen anak, paparkan nama yang dihantar ke skrin:
<p>{{ name }}</p>
Terangkan mengapa sifat peribadi _name
bermula dengan simbol garis bawah.
Laksanakan penerima (setter) dan pengambil (getter) untuk nama produk dan harganya, yang akan dihantar dari komponen induk.