An introduction to Ember's Components
Components
View Slide
Tim G. Thomas@timgthomastimgthomas.com
{{ember-atx}}
Controller + View (+ Template)Route-less
Why?
Using Components
/* ember-atx.hbs */‚/* elsewhere... */{{ember-atx}}
/* ember-atx.hbs */‚/* In 1.13... */
export default Ember.Component.extend({});
export default Ember.Component.extend({didInsertElement() {// I'm a view!}});
export default Ember.Component.extend({didInsertElement() {this.$().fadeOut();}});
export default Ember.Component.extend({itemCount: function() {// No, wait...I'm a Controller!}.property()});
export default Ember.Component.extend({itemCount: function() {return this.get('items');}.property('items')});
{{ember-atx items=model}}
export default Ember.Component.extend({items: function() {return Ember.$.getJSON('/dont/tell/anyone');}.property()});
foo: 'bar',actions: {somethingHappened() {this.attrs.foo.call({});}}
{{yield}}{{#ember-atx}}I'm a lumberjack and I'm okay...{{/ember-atx}}
{{component 'component-name'}}
guides.emberjs.comember-components.comtimgthomas.comDon't go here!
Thanks!@timgthomas