Տվյալների փոխանցում դուստր կոմպոնենտի սետտերին Angular-ում
Կարելի է անել այնպես, որ տվյալները ծնող կոմպոնենտից հասնեն սետտերին մասնավոր հատկության: Եկեք նայենք օրինակով: Ենթադրենք, մենք ունենք մասնավոր հատկություն սետտերով և գետտերով:
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;
}
}
Օրինակի համար եկեք ստեղծենք տարիքի սետտեր, որտեղ կիրականացնենք փոխանցված տվյալների ստուգում: Նաև ստեղծենք գետտեր՝ օգտագործողի հատկությունները արտածելու համար:
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;
}
}
Հիմա փոխանցենք տվյալները ծնող կոմպոնենտից դուստրին:
<user-data name="john"></user-data>
Իսկ դուստր կոմպոնենտում արտածենք փոխանցված անունը էկրանին:
<p>{{ name }}</p>
Բացատրեք, թե ինչու է մասնավոր հատկությունը _name
սկսվում ենթագծի նշանով:
Իրականացրեք սետտերներ և գետտերներ ապրանքի անվանման և դրա գնի համար, որոնք կփոխանցվեն ծնող կոմպոնենտից: