Ember property as an object

Today I had an Ember property set as an object. When I tried to access the property again to set a new key-value pair on the object, Ember kept complaining that the .set() function was not available on the object.

This is an example of what was triggering the issue:

...
pizza: {
  size: 'large',
  cost: 10.99
},
...

Then in an action in the same controller I was trying to set a new key-value pair:

actions:{
  updatePizza(){
    this.get('pizza').set('extraCheese', true);
  }
}

The problem turned out to be that, Ember wasn’t seeing the property as an Ember object, so I couldn’t set the new extraCheese: true key-value pair.

Instead what I had to do was:

actions:{
  updatePizza(){
    Ember.set(this.get('pizza'), 'extraCheese', true);
  }
}

Using Ember.set() added the new key-value pair and Ember stopped fussing about .set() function being unavailable.