Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
canary-sort-fix
import Ember from 'ember';
export default Ember.Controller.extend({
appName:'Ember Twiddle'
});
import Ember from 'ember';
var MyObject = Ember.Object.extend({
sortedItems: Ember.computed.sort('items', 'sortProps')
});
var items = Ember.A([
{ name: 'A', count: 1 },
{ name: 'A', count: 1, thing: 4, id: 1 },
{ name: 'B', count: 2 },
{ name: 'B', count: 2, thing: 3, id: 2 },
{ name: 'C', count: 3 },
{ name: 'C', count: 3, thing: 2, id: 3 },
{ name: 'D', count: 4 },
{ name: 'D', count: 4, thing: 1, id: 4 }
]);
var aSortProps = Ember.A(['name:desc', 'count']);
var bSortProps = Ember.A(['count:desc', 'thing']);
var model = Ember.Object.create({
name: 'Hello',
a: MyObject.create({
sortProps: aSortProps,
items: items
}),
b: MyObject.create({
sortProps: bSortProps,
items: items
}),
aDidChange: Ember.observer('a.sortedItems.[]', function () {
console.log('a changed');
});
});
export default Ember.Route.extend({
model() {
return model;
}
});
<h1>Welcome to {{appName}}</h1>
<br>
<br>
{{outlet}}
{{model.name}}
{{#each model.a.items as |item|}}
<div>{{item.name}} {{item.count}}</div>
{{/each}}
{{#each model.a.sortedItems as |item|}}
<div>{{item.name}} {{item.count}}</div>
{{/each}}
<br>
<br>
{
"version": "0.4.8",
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
"ember": "http://static.iamstef.net/ember-for-kris.js",
"ember-data": "https://cdnjs.cloudflare.com/ajax/libs/ember-data.js/2.0.0-beta.1/ember-data.js",
"ember-template-compiler": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/2.0.0/ember-template-compiler.js"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment