Skip to content

Instantly share code, notes, and snippets.

Joel Kang Joelkang

Block or report user

Report or block Joelkang

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile


Many people are confused by the {{mut}} helper because it seems very magical. This gist aims to help you construct a mental model for understanding what is going on when you use it.


Prior to the introduction of {{mut}}, form elements were two-way bound by default. That is, given this component:

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


Controllers are a little big of a black sheep in Ember. At one point people thought controllers were going away, and were told not to use them. Since it's unclear what the state of routeable components are, controllers are very much here to stay until that story unfolds. As such, this gist aims to provide some clarity on what controllers are (or should be), and how to use them.

Are Controllers are deprecated?

Nope. ObjectController and ArrayController are deprecated, but the Controller class exists and supersedes them. Controllers sit between your routes and the top level templates used to render those routes. While a route may be the place that obtains your data, a controller is the abstraction on top of that data that you can use to massage the data for presentational purposes. My favorite example of a controller is to combine two lists into a single array for loopin

Joelkang /
Last active Jun 5, 2018
Intermediate Ember Routing


This gist walks through some best-practices for intermediate routing architecture, augmenting the information already covered in the guides. It will cover:

  • Nested routes and outlet placement
  • Resuing templates for multiple routes
  • Normalising routes

By the end of the gist, you should be able to make informed decisions about how to structure your routes and their templates. This guide is not meant to provide all the answers, but to help you understand the tools available to you for architecting your app.

Joelkang / application.controller.js
Last active Mar 21, 2016
Dragging an element in a component
View application.controller.js
import Ember from 'ember';
export default Ember.Controller.extend({
appName: 'Ember Twiddle'
Joelkang / application.controller.js
Last active Feb 12, 2016
Sort by nested property
View application.controller.js
import Ember from 'ember';
export default Ember.Controller.extend({
appName:'Ember Twiddle',
list: Ember.A([
level1: {
level2: "one",
l2Array: [1, 4, 5]
You can’t perform that action at this time.