15 Things You Shouldn't Do In Ember Anymore

15 Things You Shouldn't Do In Ember Anymore

2956e2cd2664630aa968b92bbb645f2f?s=128

Kerrick Long

August 03, 2015
Tweet

Transcript

  1. 2.

    Kerrick Long Things I make and do Where to find

    me online twitter.com/KerrickLong github.com/Kerrick Lead Front-end Developer at Second Street KerrickLong.com www. meetup.com/ STLEmber
  2. 6.

    import Ember from 'ember';
 
 export default Ember.Controller.extend({
 needs: ['pages'],


    title: 'controllers.pages.model.title'
 });
 Using needs in Controllers
  3. 10.

    import Ember from 'ember';
 
 export default Em.Service.extend({
 minutes: 480,


    hours: Em.computed('minutes', function(k, v) {
 if (arguments.length > 1) {
 this.set('minutes', v * 60);
 }
 
 return this.get('minutes') / 60;
 })
 }); Computed getter / setter
  4. 11.

    Computed getter / setter import Ember from 'ember';
 
 export

    default Em.Service.extend({
 minutes: 480,
 hours: Em.computed('minutes', {
 get() {
 return this.get('minutes') / 60;
 },
 set(k, v) {
 return this.set('minutes', v * 60);
 }
 })
 });
  5. 13.

    Using this.resource Router.map(function() {
 this.resource('pages', function() {
 this.resource('comments');
 });
 });

    // app/routes/comments/index.js
 export default Ember.Route.extend({
 model() {
 return this.store.find('comments');
 }
 });
  6. 14.

    Using this.resource Router.map(function() {
 this.route('pages', function() {
 this.route('comments');
 });
 });


    // app/routes/pages/comments/index.js
 export default Ember.Route.extend({
 model() {
 return this.store.find('comments');
 }
 });
  7. 32.

    Using arrayComputed import Ember from 'ember';
 
 export default Ember.Controller.extend({


    uniqueChildren: Ember.arrayComputed('model.@each.children.[]', {
 addedItem: function(accumulatedValue, model) {
 accumulatedValue.addObjects(model.get('children'));
 return accumulatedValue.uniq();
 },
 removedItem: function(accumulatedValue, model) {
 accumulatedValue.removeObjects(model.get('children'));
 return accumulatedValue.uniq();
 }
 })
 });
  8. 33.

    Using arrayComputed import Ember from 'ember';
 
 export default Ember.Controller.extend({


    uniqueChildren: Ember.computed('model.@each.children.[]', function() {
 return _.flatten(this.get('model').map(x => x.get('children'))).uniq();
 })
 });
  9. 35.

    Using reduceComputed import Ember from 'ember';
 
 export default Ember.Controller.extend({


    total: Ember.reduceComputed('model.@each.value', {
 initialValue: 0,
 addedItem(accumulatedValue, item) {
 return accumulatedValue + item.get('value');
 },
 removedItem(accumulatedValue, item) {
 return accumulatedValue - item.get('value');
 }
 })
 });
  10. 36.

    Using reduceComputed import Ember from 'ember';
 
 export default Ember.Controller.extend({


    total: Ember.computed('model.@each.value', function() {
 const addValues = (p, x) => p + x.get('value');
 return this.get('model').reduce(addValues, 0);
 })
 });
  11. 41.

    Using ArrayController import Ember from 'ember';
 
 export default Ember.ArrayController.extend({


    sortProperties: ['date', 'name']
 // You can use `arrangedContent`
 });