javascript - Is this method of component communication an Ember anti-pattern? -


take html , js:

{{#main-view}}   <!-- page html - header, content, etc. -->    {{some-action tagname='button'}}    <!-- more page html -->  {{/main-view}} 
// components/main-view.js  ember.component.extend({   mainview: true,   dosomething: function() { alert('doing something') } })  // components/some-action.js  ember.component.extend({   mainview: null,    configuremainview: function() {     this.set('mainview', this.nearestwithproperty('mainview');   }.on('didinsertelement'),    click: function() {     this.get('mainview').dosomething();    } }) 

the idea have descendent components able interact interfaces of ancestors. use case example want individual page content containers able configure whether or not hamburger menu available on page, {{page-content show-menu='false'}}. way can define menu @ top level , let children configure need content.

i'm coming angular world, seems more preferred way handle kind of thing in ember bind controller properties or handle actions in routes/controller actions @ appropriate level in action bubbling. can't feel in many cases controllers , routes have no business worrying ui configurations, , related ui components should able communicate each other , leave controllers out of it.

another pattern i've seen in ember-cli addons has been children components lookup , register specific parent. , parent call interfaces of children, or manipulate them see fit. same concept above, opposite.

the 'ember way' communicate add action handler component parent template:

// components/main-view.js

{{#main-view}}   <!-- page html - header, content, etc. -->    {{some-action tagname='button' action="dosomething"}}    <!-- more page html -->  {{/main-view}} 

// components/some-action.js

ember.component.extend({   click: function() {     this.sendaction();   } }); 

if don't want handle on parent, let bubble up. goes on in guide: http://guides.emberjs.com/v1.11.0/components/sending-actions-from-components-to-your-application/


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -