Ember - Sort Model after findAll
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I'm using Emberfire in my app, and I'm trying to findAll stats, and then sort that model by a key, like in the following example. But, when I sort this way I lose the ability to see real time updates in my template and I have to reload the page to see the new/updated data in the view.
model() {
return this.store
.findAll('stats', {
reload: true,
backgroundReload: true
})
.then(stats => stats.sortBy('date'));
}
ember.js emberfire
asked Nov 26 '18 at 21:23
fentechfentech
759
add a comment |
I'm using Emberfire in my app, and I'm trying to findAll stats, and then sort that model by a key, like in the following example. But, when I sort this way I lose the ability to see real time updates in my template and I have to reload the page to see the new/updated data in the view.
model() {
return this.store
.findAll('stats', {
reload: true,
backgroundReload: true
})
.then(stats => stats.sortBy('date'));
}
ember.js emberfire
asked Nov 26 '18 at 21:23
fentechfentech
759
add a comment |
I'm using Emberfire in my app, and I'm trying to findAll stats, and then sort that model by a key, like in the following example. But, when I sort this way I lose the ability to see real time updates in my template and I have to reload the page to see the new/updated data in the view.
model() {
return this.store
.findAll('stats', {
reload: true,
backgroundReload: true
})
.then(stats => stats.sortBy('date'));
}
ember.js emberfire
asked Nov 26 '18 at 21:23
fentechfentech
759
I'm using Emberfire in my app, and I'm trying to findAll stats, and then sort that model by a key, like in the following example. But, when I sort this way I lose the ability to see real time updates in my template and I have to reload the page to see the new/updated data in the view.
model() {
return this.store
.findAll('stats', {
reload: true,
backgroundReload: true
})
.then(stats => stats.sortBy('date'));
}
ember.js emberfire
ember.js emberfire
asked Nov 26 '18 at 21:23
fentechfentech
759
asked Nov 26 '18 at 21:23
fentechfentech
759
asked Nov 26 '18 at 21:23
fentechfentech
759
asked Nov 26 '18 at 21:23
fentechfentech
759
asked Nov 26 '18 at 21:23
fentechfentech
759
759
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
You have to define a computed property at your controller or a component, which returns the sorted stats. Do not sort your data at route's model hook. Just return the promise of findAll.
For example:
//controller.js or component.js
sortedStats: computed('model.@each.date', function() {
return this.get('model').sortBy('date');
})
Furthermore ember offers a sort macro:
import { sort } from '@ember/object/computed';
By using it you can solve your requirement more elegant:
// ...
this.init() {
this._super(...arguments);
this.set('sortDefinition', ['date:asc']);
}
sortedStats: sort('model.@each.date', 'sortDefinition')
// ...
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
Your computed property may should havemodel.@each.dateas dependent key. Otherwise it's not invalidated ifdateof an object inmodelchanges. You may want to usesortmacro.
– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53489283%2fember-sort-model-after-findall%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You have to define a computed property at your controller or a component, which returns the sorted stats. Do not sort your data at route's model hook. Just return the promise of findAll.
For example:
//controller.js or component.js
sortedStats: computed('model.@each.date', function() {
return this.get('model').sortBy('date');
})
Furthermore ember offers a sort macro:
import { sort } from '@ember/object/computed';
By using it you can solve your requirement more elegant:
// ...
this.init() {
this._super(...arguments);
this.set('sortDefinition', ['date:asc']);
}
sortedStats: sort('model.@each.date', 'sortDefinition')
// ...
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
Your computed property may should havemodel.@each.dateas dependent key. Otherwise it's not invalidated ifdateof an object inmodelchanges. You may want to usesortmacro.
– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
add a comment |
You have to define a computed property at your controller or a component, which returns the sorted stats. Do not sort your data at route's model hook. Just return the promise of findAll.
For example:
//controller.js or component.js
sortedStats: computed('model.@each.date', function() {
return this.get('model').sortBy('date');
})
Furthermore ember offers a sort macro:
import { sort } from '@ember/object/computed';
By using it you can solve your requirement more elegant:
// ...
this.init() {
this._super(...arguments);
this.set('sortDefinition', ['date:asc']);
}
sortedStats: sort('model.@each.date', 'sortDefinition')
// ...
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
Your computed property may should havemodel.@each.dateas dependent key. Otherwise it's not invalidated ifdateof an object inmodelchanges. You may want to usesortmacro.
– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
add a comment |
You have to define a computed property at your controller or a component, which returns the sorted stats. Do not sort your data at route's model hook. Just return the promise of findAll.
For example:
//controller.js or component.js
sortedStats: computed('model.@each.date', function() {
return this.get('model').sortBy('date');
})
Furthermore ember offers a sort macro:
import { sort } from '@ember/object/computed';
By using it you can solve your requirement more elegant:
// ...
this.init() {
this._super(...arguments);
this.set('sortDefinition', ['date:asc']);
}
sortedStats: sort('model.@each.date', 'sortDefinition')
// ...
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
You have to define a computed property at your controller or a component, which returns the sorted stats. Do not sort your data at route's model hook. Just return the promise of findAll.
For example:
//controller.js or component.js
sortedStats: computed('model.@each.date', function() {
return this.get('model').sortBy('date');
})
Furthermore ember offers a sort macro:
import { sort } from '@ember/object/computed';
By using it you can solve your requirement more elegant:
// ...
this.init() {
this._super(...arguments);
this.set('sortDefinition', ['date:asc']);
}
sortedStats: sort('model.@each.date', 'sortDefinition')
// ...
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
edited Nov 28 '18 at 7:42
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
answered Nov 26 '18 at 21:44
wuarminwuarmin
1,006619
1,006619
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
Your computed property may should havemodel.@each.dateas dependent key. Otherwise it's not invalidated ifdateof an object inmodelchanges. You may want to usesortmacro.
– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
add a comment |
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
Your computed property may should havemodel.@each.dateas dependent key. Otherwise it's not invalidated ifdateof an object inmodelchanges. You may want to usesortmacro.
– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
This is perfect. Thank you for this!
– fentech
Nov 27 '18 at 3:24
1
1
Your computed property may should have
model.@each.date as dependent key. Otherwise it's not invalidated if date of an object in model changes. You may want to use sort macro.– jelhan
Nov 27 '18 at 23:05
Your computed property may should have
model.@each.date as dependent key. Otherwise it's not invalidated if date of an object in model changes. You may want to use sort macro.– jelhan
Nov 27 '18 at 23:05
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
@jelhan Thanks for the hint. I updated the answer.
– wuarmin
Nov 28 '18 at 6:45
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53489283%2fember-sort-model-after-findall%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
