What’s the “Ember Way” to trigger events between loosely coupled components? I’m looking for something similar to the much abused NsNotificationCenter in iOS.
In my use case I have two components that work on an OpenLayers map, and each component needs to be notified when the other performs some action on the map. There is no other relationship between the components, and each can work fine independently of the other. Currently I’m solving this by triggering custom jQuery events on the map’s container div, and listening for those events. But it feels like an anti-pattern in the Ember world.
Great question! The “official” recommendation to solve this is to use the “data down, actions up” pattern. That is, that your components communicate with their surroundings via their interface. For example:
{{ main-map lat=model.latitude lon=model.longitude on-zoom-click=(action "something") }}
Since you mention that there is “no other relationship between the components, and each can work fine independently”, I assume there is no shared data model(s)? When an event is triggered on one, is this purely UI-related or does cause a change in data?
Using an event bus (some see it as an anti-pattern) has its downsides, but can be useful in certain situations. I recently wrote up a summary (linking to other posts, too) about possible solutions and their pros/cons.
Perhaps that helps. If you find that event bus example applicable to your case, make sure you read the linked articles (upward, downward, sideways…) before fully committing to it.
1 Like
That’s exactly the sort of thing I was thinking of! Thanks!
1 Like