Show Menu
Cheatography

emberjs Cheat Sheet (DRAFT) by

A simple cheat sheet for Ember > 2.0 developers

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Ember CLI

Create a new app
ember new <na­me>
Route
ember g route <na­me>
Nested Route
ember g model <na­me>­/<n­est­edr­out­e>
Component (must contain a dash)
ember g component <co­mp-­nam­e>
Model
ember g model <na­me>
Template
ember g template <na­me>
Service
ember g service <na­me>
Resource
ember g resource <na­me>
Serializer
ember g serializer <na­me>
Mixin
ember g mixin <na­me>
Adapter
ember g adapter <na­me>
View
ember g view <na­me>
Addon
ember addon <na­me>
Blueprint
ember g blueprint <na­me>
Initia­lizer
ember g initia­lizer <na­me>
Server
ember s
Test
ember test --server
 

Common API Usage

Ember.c­om­puted - component
title: Ember.c­om­put­ed(­'ti­tle', functi­on(){ return this.g­et(­'ti­tle'); }),
Ember.c­om­puted - model
isForm­Valid: Ember.c­om­put­ed.a­li­as(­'va­lid­ati­ons.is­Valid')
Inject a service
store: Ember.i­nj­ect.se­rvice()

Routes

Return a model
return Ember.R­SV­P.H­ash­({});
 

ember-­cp-­val­ida­tions

const Validations = buildValidations({
  name: [ 
	validator('presence', {
  		presence: true,
  		messageKey: 'errors.fieldRequired'
  	}),
  	validator('length', {
    	min: 2,
    	max: 50
    })
  ],
  password: [
    validator('presence', {
  		presence: true,
  		messageKey: 'errors.fieldRequired'
  	}), 
    validator('length', {
      min: 10,
      max: 20
    })
  ],
  email: [
    validator('presence', {
  		presence: true,
  		message: 'This field is required'
  	}), 
    validator('format', { 
    	type: 'email',
    	message: 'Please enter a valid email address'
    })
  ]
},{
	description: 'This field',
	dependentKeys: ['i18n.locale']
});

const Users = Model.extend(Validations, {
  email: attr('string'),
  password: attr('string'),
  name: attr('string'),
  created: attr('string'),
  status: attr('string'),
  isFormValid: Ember.computed.alias('validations.isValid')
});
 

Components

Blame backend
{{blame-backend arrowD­ir=­"­lef­t/r­igh­t"}}