Update a saved property without refreshing the page

Apologies for this basic question. I feel like I’m misunderstanding some core Ember concept and would appreciate clarification.

In one route, I’m updating a property on an Ember data model when a user selects an option from a dropdown and clicks ‘save’. It’s saving properly. I’ve logged the property, and when it’s done saving, the correct value prints.

In another route, I'm accessing that same model in a component template. I’m just printing it, like so: <div></div>

Because I’m referencing a specific model property from within a template, I expect that the DOM will update with the new property value, without refreshing the page. This is not the case - it only updates after refresh.

In an effort to bypass this, I tried making a computed property, even though I’m fairly sure I shouldn’t have to do that:

  userName: computed('user.name', function() {
    return this.get('user.name');
  })

And then I tried to access the computed property in the template like: <div></div>

Nope.

Obviously I’ve made some grave miscalculation. Can anyone explain expected behavior here (and let me know how I can have this property update without refreshing)? Thanks.