ember.js | notify other components on one component action
ember.js
Solution
With `Ember.Component` you don't have the control of the childViews, so I used the `Ember.CollectionView`, to manage the items. Because `App.PostSummaryComponent` already extends `Ember.Component`, I delegate to the `Ember.CollectionView` that behavior using `view containerViewClass` in the template. So we have the best of the two worlds.
Since that `containerViewClass` property is a class, we need a way to access that instance - to interact with the `childViews` - when the view is created. To do this you have to use `viewName='containerView'` in the template. This tells Ember, that a new instance of `containerViewClass` will be setted in a property called `containerView`. So we can use `this.get("containerView")` in `App.PostSummaryComponent`.
The last change was moving the `each` helper from index template to the component template. So others calls to the component doesn't need to repeat it.
http://jsbin.com/ebayip/2/edit
Problem
in the components section at Ember's guides there a demo of Post Summary Component, clicking on one Post Summery title opens its content below it. I would like to add the functionality to close any other opened Post summaries at the same time. The purpose on my question is the understand how ember speaks between components without sacrificing isolation. the solutions I thought about are: have some wrapper component that handles it in some way firing an event like 'post-summery:open' and make other components close themselves on it (but then it can Collide with other places on the app using the same components for diffecnt uses) this is the original demo from the documentation: http://jsbin.com/uyibis/1/edit This is how I would Implement the behavior with jQuery: http://jsbin.com/eremon/2/edit var $contents = $('.content').hide(); $(document).on('click', '.title', function () { $contents.hide(); $(this).next('.content').show(); });