Gegevens doorgeven aan de setter van een child component in Angular

Het is mogelijk om ervoor te zorgen dat gegevens van het oudercomponent terechtkomen in de setter van een privé eigenschap. Laten we een voorbeeld bekijken. Stel dat we een privé eigenschap hebben met een setter en een 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;
	}
}

Laten we voor het voorbeeld een setter voor de leeftijd maken, waarin we een controle op de doorgegeven gegevens implementeren. We maken ook een getter om de eigenschappen van de gebruiker weer te geven:

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;
	}
}

Laten we nu gegevens van het oudercomponent doorgeven aan het child component:

<user-data name="john"></user-data>

En in het child component geven we de doorgegeven naam weer op het scherm:

<p>{{ name }}</p>

Leg uit waarom de privé eigenschap _name begint met een underscore.

Implementeer setters en getters voor de productnaam en de prijs, die doorgegeven zullen worden vanuit het oudercomponent.