updating ember fixture data from chrome console

Question

Below are some pieces of my simple application where I have a function in my controller which filters some data and a template which displays them. Everything works the way it should except when I manually update my fixture data from the Chrome Console, the data is not updated in the template. Shouldn't it be since it's binded with property?

What I'm doing in Chrome Console to update is App.Nick.FIXTURES[0]['nick'] = "new data"

//controllers/NicksController

  noNick: function() {
    return this.get('content').filterProperty('nick', null);
  }.property('content.@each.nick')

//fixtures/nick.js

App.Nick.FIXTURES = [
  {
    id: "1",
    nick: "test1",
  },
  {
    id: "2",
    nick: "test2",
  },
  {
    id: "3",
    nick: null,
  }
];

//templates/nicks
<ul class="nav nav-tabs nav-stacked">
  {{#each nick in nicks.noNick}}
    <li>{{nick.nick}}</li>
  {{/each}}
</ul>

score 1 · Accepted Answer · edited May 23 '17 at 12:20

You should think of those fixture objects as mock responses from the server, once received they are no longer hooked up to the actual record.

You'll need to get a reference to the record and make modifications to the record already loaded in the store. See Ember Data: Get a Model in the Console

BTW: In ember it's important to use getters and setters.

var store = App.__container__.lookup('store:main');
var nick = store.find('nick', 1);
nick.set('name', 'foo');

updating ember fixture data from chrome console

1 Answers1