Maintenant que la différence de performance entre $broadcast
et $emit
a été éliminé, est - il une raison de préférer $scope.$emit
à $rootScope.$broadcast
?
Ils sont différents, oui.
$emit
est limité à la hiérarchie des portées (vers le haut) - cela peut être bien, si cela correspond à votre conception, mais cela me semble une restriction plutôt arbitraire.
$rootScope.$broadcast
fonctionne à travers tous ceux qui choisissent d'écouter l'événement, ce qui est une restriction plus sensible dans mon esprit.
Suis-je en train de manquer quelque chose?
ÉDITER:
Pour clarifier en réponse à une réponse, la direction de l'envoi n'est pas le problème que je recherche. $scope.$emit
répartit l'événement vers le haut et $scope.$broadcast
- vers le bas. Mais pourquoi ne pas toujours utiliser $rootScope.$broadcast
pour atteindre tous les auditeurs visés?
la source
Réponses:
tl; dr (ce tl; dr provient de la réponse de @ sp00m ci-dessous)
Explication détaillée
$rootScope.$emit
permet seulement aux autres$rootScope
auditeurs de l'attraper. C'est bien quand vous ne voulez pas que tout$scope
le monde l'obtienne. Surtout une communication de haut niveau. Considérez-le comme des adultes qui se parlent dans une pièce pour que les enfants ne puissent pas les entendre.$rootScope.$broadcast
est une méthode qui permet à peu près tout de l'entendre. Ce serait l'équivalent de parents criant que le dîner est prêt pour que tout le monde dans la maison l'entende.$scope.$emit
c'est quand vous voulez ça$scope
et tous ses parents et$rootScope
entendre l'événement. Il s'agit d'un enfant pleurnichant à ses parents à la maison (mais pas dans une épicerie où d'autres enfants peuvent entendre).$scope.$broadcast
est pour$scope
lui - même et ses enfants. C'est un enfant qui chuchote à ses animaux en peluche pour que leurs parents n'entendent pas.la source
$rootScope
possible, éviter les émissions permet une meilleure réutilisation.Ils ne font pas le même travail:
$emit
distribue un événement vers le haut à travers la hiérarchie d'étendue, tandis que$broadcast
distribue un événement vers le bas à toutes les étendues enfants.la source
$rootScope
?J'ai créé le graphique suivant à partir du lien suivant: https://toddmotto.com/all-about-angulars-emit-broadcast-on-publish-subscribing/
Comme vous pouvez le voir,
$rootScope.$broadcast
frappe beaucoup plus d'auditeurs que$scope.$emit
.De plus,
$scope.$emit
l'effet bouillonnant de peut être annulé, alors$rootScope.$broadcast
qu'il ne le peut pas.la source
$ scope. $ emit: cette méthode distribue l'événement vers le haut (de l'enfant au parent)
$ scope. $ broadcast: la méthode distribue l'événement dans le sens descendant (du parent à l'enfant) à tous les contrôleurs enfants.
$ scope. $ on: La méthode s'inscrit pour écouter un événement. Tous les contrôleurs qui écoutent cet événement reçoivent une notification de la diffusion ou émettent en fonction de leur place dans la hiérarchie enfant-parent.
L'événement $ emit peut être annulé par n'importe qui de la portée $ qui écoute l'événement.
$ On fournit la méthode "stopPropagation". En appelant cette méthode, il est possible d'empêcher la propagation de l'événement.
Plunker: https://embed.plnkr.co/0Pdrrtj3GEnMp2UpILp4/
Dans le cas de portées frère (les portées qui ne sont pas dans la hiérarchie parent-enfant directe), $ emit et $ broadcast ne communiqueront pas avec les portées frère.
Pour plus de détails, veuillez consulter http://yogeshtutorials.blogspot.in/2015/12/event-based-communication-between-angularjs-controllers.html
la source
@Eddie a donné une réponse parfaite à la question posée. Mais je voudrais attirer l'attention sur l'utilisation d'une approche plus efficace de Pub / Sub.
Comme suggère cette réponse,
vous pouvez utiliser un
angular-PubSub
module angulaire. une fois que vous ajoutezPubSub
module à la dépendance de votre application, vous pouvez utiliser lePubSub
service pour vous abonner et vous désabonner des événements / sujets.Inscription facile:
Facile à publier
Pour vous désinscrire, utilisez
PubSub.unsubscribe(sub);
ORPubSub.unsubscribe('event-name');
.REMARQUE N'oubliez pas de vous désabonner pour éviter les fuites de mémoire.
la source
Utiliser RxJS dans un service
Créez un service avec les extensions RxJS pour Angular .
Il vous suffit ensuite de vous abonner aux modifications.
Les clients peuvent souscrire aux modifications avec
DataService.subscribe
et les producteurs peuvent pousser les modifications avecDataService.set
.La DEMO sur PLNKR .
la source