J'ai un drapeau dont la valeur change si nous faisons des opérations. Si l'indicateur change, je dois transmettre la valeur modifiée du composant enfant en composant racine.
En tant que composant d'application est un composant bootsTrapped, y a-t-il un moyen de transmettre des données de l'enfant à la racine afin que je puisse obtenir les données sans chargement de la page?
J'ai essayé @viewChild ainsi que le service de données partagé.
5 Réponses :
Utilisez EventMitter dans un composant enfant.
https://angular.io/api/core/ Emismitter P>
Composant enfant: P>
onFlagChange() {
console.log('Child flag has changed!')
}
Vous pouvez utiliser le sujet observable en angulaire, vous pouvez appuyer sur les valeurs de votre drapeau sur le sujet lorsque des actions effectuent au niveau des composants enfants. Vous pouvez souscrire ces sujets dans le composant racine. Une fois les modifications apportées au sujet de la composante enfant, composant racine Obtenez les valeurs du sujet et que vous utilisez les émetteurs d'événements de sortie de l'AIME également dans Angular
passer des données de l'enfant à un composant parent que vous pouvez:
ViewChild () EnfantComponent: EnfantComponent; et sur l'utilisation du composant parent Utilisez enfanticomponent.flag
- Créez une sortie
() et émettez le drapeau avec un événement EventMitter
- Créez un
Sujet () et S'ABRON () S'ADRE
Utilisez Emismitter dans un composant enfant et abonnez-vous au composant parent
Comme déjà mentionné, vous pouvez utiliser la propriété @Output qui émet un événement à partir du composant à son parent ou vous pouvez également utiliser un service partagé.
Vous pouvez déclencher directement dans le modèle p> ou appelez une méthode dans la classe si vous Besoin de faire quelque chose avant d'émettre l'événement: P> // FooComponent
export class FooComponent {
constructor(private fooBarService: FooBarService) {}
updateData() {
this.fooBarService.updateData(// put your data);
}
}
Avez-vous essayer la propriété @Output
Quel est le problème avec l'utilisation d'un service de données partagé?
J'ai utilisé la propriété @Output pour émettre le drapeau modifié jusqu'à APP.COMPONENT. Je suis capable de le recevoir dans le composant parent immédiat, mais il n'est pas déclenché sur APP.COMPONENT.