neborn

import Ember from 'ember';

export default Ember.Component.extend({
});

neborn

import Ember from 'ember';

export default Ember.Component.extend({
});

neborn

import Ember from 'ember';

export default Ember.Component.extend({
  selectionEnabled: false,
  query: '',
  items: Ember.computed(() => [
    { title: 'A' }, { title: 'B' }, { title: 'C' }, { title: 'D' }
  ]),
  selectedItems: Ember.computed(() => []),
  notSelectedItems: Ember.computed('selectedItems.[]', 'items.[]', function() {

neborn

import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    oneWay() {
      this.sendAction('anAction', 'One way was used');
    },
    anotherWay() {
      this.attrs.anAction('Another way was used');
    },

neborn

import Ember from 'ember';

// I made this a component for the convenience of the example (i.e. to use it direclty with the component helper when yielding). But it would probably be better suited to being a mixin.
export default Ember.Component.extend({
  classNameBindings: ['bemClassNames'],
  bemBlock: '',
  bemElement: '',
  bemModifier: '',
  bemClassNames: Ember.computed('bemBlock', 'bemElement', 'bemModifiers', function() {
    const bemElement = this.get('bemElement');

neborn

import Ember from 'ember';

export default Ember.Controller.extend({
  originalProperty: 'Hello',
  aliasProperty: Ember.computed.alias('originalProperty'),
  oneWayProperty: Ember.computed.oneWay('originalProperty'),
  readOnlyProperty: Ember.computed.readOnly('originalProperty')
});

neborn

import Ember from 'ember';

export default Ember.Component.extend({
  myArray: [],
  actions: {
    addItem() {
      this.get('myArray').addObject({});
    }
  }
});

neborn

import Ember from 'ember';

export default Ember.Component.extend({
});

neborn

import Ember from 'ember';

export default Ember.Component.extend({
  myBoolean: true,
  notMyBoolean: Ember.computed.not('myBoolean'),
  actions: {
    toggleBoolean(prop) {
      this.toggleProperty(prop);
    }
  }

neborn

import Ember from 'ember';

export default Ember.Component.extend({
  myName: "My Component",
  myClickHandler() {
    console.log(this.get('myName'));
  }
});