ember.js - EmberJS: refreshing a data model does not update associated computed properties -

let's there route capabilities update it's data when requested user (assume backend returns different data same call, maybe it's stock data, or random numbers).

export default ember.route.extend({   model() {     return this.get('store').findall('foo');   },    actions: {     invalidatemodel() {       this.refresh();     }   } }); 

now, component consuming model directly update view expected.

model: {{#each model |m|}}{{m.bar}}{{/each}} <button {{action "refreshmodel"}}>refresh model</button> 

but, if component using computed property observing model, updates not carry through.

template

model: {{#each computedmodel |m|}}{{m}}{{/each}} <br> <button {{action "refreshmodel"}}>refresh model</button> 

component

computedmodel: ember.computed('model', function() {   return this.get('model').map(function(m) {     return `computed: ${m.data.bar}`;   }); }), 

for full repro, can check out: https://github.com/myartsev/ember-computed-properties-on-data-model

the latest commit non-working computed properties case.
previous commit when still working correctly when using model directly.

what missing?

your computed property listening changes array itself. try listening changes arrays items model.[]

https://guides.emberjs.com/v2.15.0/object-model/computed-properties-and-aggregate-data/#toc_code-code-vs-code-each-code

computedmodel: ember.computed('model.[]', function() {   return this.get('model').map(function(m) {     return `computed: ${m.data.bar}`;   }); }), 

update

here twiddle showing above solution fixes problem.

if it's not working on end there issue api returning.

as per comments how send actions. using 2 year old syntax ember 1.13 not familiar with.

i suggest read the docs version running ember 2.15