Ember property as an object

Written by Michael Lee on April 22, 2016

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.

Thanks for taking the time to read this article. I'd love to stay in touch and share more tips on programming and design, side projects and working remotely. Sign up and I'll send you my articles straight to your email.

:wave: Hey hey, I'm Michael Lee! I really appreciate you taking the time to read this article.

Be sure to check out my other articles.