Search code examples
ember.jsember-cli

Ember: Show service variable on template dynamically


I have template which shows the service variable. And when I update the service variable from other controllers, it doesn't update on template. How can I implement this?

Code Snippets:

component JS file

export default A({
  notification_area: Ember.inject.service(),
  notification_number: Ember.computed(function() {
    return this.get('notification_area').get('total');
  }),
});

Template .hbs file

<div>{{notification_number}}</div>

Other controller: Updates service variable 'total'

let total_notification_number =this.get('notification_area').get('total');
this.get('notification_area').set('total', total_notification_number+1);

Solution

  • Try this line instead of your computed property

    notification_number: Ember.computed.oneWay('notification_area.total')
    

    Your code is fine but you forgot to tell your computed property that it monitors changes, so you could also do Ember.computed('notification_area.total',, function() ...

    Hope it helps