Comment communiquer entre la composante Angulaire?
Je travaille sur une application web de projet et je suis en train d'utiliser Angulaire, je reçois un problème avec le composant de communication. Comment, par exemple, un composant parent à l'échange de données composant enfant, la façon de communiquer entre les frères et sœurs des composants.
- Dépend de ce que vous voulez faire. Essayez-vous d'essayer de faire du rpc, de la transmission de message ou tout simplement partager des variables?
Vous devez vous connecter pour publier un commentaire.
Si vous tentez de communiquer à partir d'un composant parent à un enfant de composant, c'est assez clairement décrites à l'aide de @Entrée et EventEmitters avec @Sortie dans l'angle de docs.
Angulaire 2 composant d'interaction
Que pour la communication entre frères et sœurs, j'ai posté une réponse à une question similaire qui pourrait aider avec le problème du partage de données à travers le frère de composants. Actuellement, je pense que cette méthode est la plus efficace.
angulaires-2-sœur-composant-communication
À l'aide d'un service:
et vous pouvez publier des événements comme des messages comme ceci:
et vous pouvez vous abonner à ces événements:
@Entrée et @Sortie
Si il y a plusieurs parties composantes
vous pouvez utiliser @Entrée et à la Sortie pour l'échange de données.
Document : https://angular.io/guide/component-interaction
exemple: https://angular.io/generated/live-examples/component-interaction/eplnkr.html
L'Injection De Dépendance
vous pouvez stocker les données dans le Service, et ensuite injecter de Service dans le composant pour lequel vous voulez. comme "utilisateur.serveur.ts" dans l'exemple:
https://angular.io/generated/live-examples/dependency-injection/eplnkr.html
Vous aurez besoin d'utiliser l'injection de dépendance. Voici un petit exemple:
https://github.com/gdi2290/angular2do/blob/gh-pages/app/components/todo-item/todo-item.js
Il est Événements API angulaire qui peut le faire pour vous.
Cliquez ici pour plus de détails sur les Événements.
Ci-dessous est un exemple rapide, je suis actuellement aide dans mon projet. Espérons que cela aide quelqu'un dans le besoin.
Utilisation :
Inter de communication du composant peut être réalisé en AngularJS. Dans AngularJS, nous avons quelque chose qui s'appelle comme besoin de la propriété qui doit être mappé dans le composant. Suivez l'exemple ci-dessous qui permettra d'accéder à la fonction addPane(paramètre) de la composante myTabs de la composante myPane: -
Structure de projet:
HTML
JS
script.js
JS:
index.html
HTML:
my-tabs.html
HTML:
my-pane.html
HTML:
Extrait de Code : https://plnkr.co/edit/diQjxq7D0xXTqPunBWVE?p=preview
Référence: https://docs.angularjs.org/guide/component#intercomponent-communication
Espère que cela aide 🙂