Getting data out of Ember-data

Question

I am using Ember 1.13.9 an Ember-data 1.13.11 and struggling to have Ember Data do what I would like. As an example, I have a model called "goal" and a

goals: Ember.on('init', Ember.computed(function() {
  const {store} = this.getProperties('store');
  return store.findAll('goal');
})),

When this runs it does query the database and put the appropriate records into the store BUT getting them out of the store is my problem. I would have thought that once the Promise resolved that I'd be able to iterate over the array of results. Using the inspector I can see that at clients.goals.content.content (where clients is the name of the server I see this from the inspector:

First of all this is pretty deep into the structure. I was hoping Ember's "get" would allow me to simply say something like data.get('content.0.id') but this just comes back as undefined. Second of all the crazy structure continues in that each of these listed objects are InternalModel objects which only have the following structure to them:

Note that:

there are two InternalModels, that is the right number (matches store results)
the id property is available here
there is an internal property called _data which has the other attributes of the record

Ok so in a completely hacky way I could pull out what I need but surely I shouldn't be writing code like:

_goals: Ember.on('init', function() {
  const {store} = this.getProperties('store');
  store.findAll('goal').then(data => {
    let result = [];
    data.forEach(item => {
      let record = item.get('data'); // this gets what's in _data apparently
      record.id = item.get('id');
      result.push(record);
    }
    this.set('goals', result);
}),

Yuck. What am I missing?

Omg, data is collection of models, why do you create another collection which is exactly the same? — Daniel
– Daniel, Commented Sep 10, 2015 at 13:56
I'm sure what I'm doing is wrong, hence the question, but I am not creating another collection which is exactly the same ... the 'data' property which I set once the promise is resolved is a working array of records but terribly ugly in its extraction. — ken
– ken, Commented Sep 10, 2015 at 14:00
Why do you access data property when you have all attributes directly in record? It's unclear for me. What is so special in using goals that you need to create another array? Where do you struggle with using that? I think it's missing part of question. — Daniel
– Daniel, Commented Sep 10, 2015 at 14:03
when I execute let record = item.get('data'); I gain access to that attributes but not the id — ken
– ken, Commented Sep 10, 2015 at 14:06

Artur Smirnov · Accepted Answer · 2015-09-11 13:18:30Z

1

If you need to convert Ember model to plain object you can use Model.serialize or Model.toJSON methods.

Update:

If you need to not just extract the data from models but to access fetched models via computed property, there are several ways to implement it.

1) Synchronous property (collection):

Controller:

import Ember from 'ember'
export default Ember.Controller.extend({
    goals: [],

    someProperty: Ember.computed('goals.@each', function () {
        var goals = this.get('goals');
        goals.forEach(goal => {
            console.log( goal.get('someProperty') );
        });
    })
});

Route:

import Ember from 'ember'
export default Ember.Route.extend({
    setupController: function (controller, model) {
        this._super(controller, model);
        this.store.findAll('goal').then(goals => {
            controller.set('goals', goals);
        });
    }
});

Template:

{{#each goals as |goal|}}
    {{log goal}}
{{/each}}

2) Asynchronous property (promise):

Controller:

import Ember from 'ember'
export default Ember.Controller.extend({
    goals: Ember.computed(function () {
        var storeGoals = this.store.peekAll('goal') || [];
        if (storeGoals.length) {
            return RSVP.resolve(storeGoals);
        } else {
            return this.store.findAll('goal')
        }
    }),

    someProperty: Ember.computed('goals.@each', function () {
        var goals = this.get('goals').then(resolvedGoals => {
            resolvedGoals.forEach(goal => {
                console.log( goal.get('someProperty') );
            });
        });
    })
});

Template:

{{#each goals as |goal|}}
    {{log goal}}
{{/each}}

edited Sep 11, 2015 at 13:18

answered Sep 10, 2015 at 14:44

Artur Smirnov

8045 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

ken Over a year ago

I'm not trying to do that. I just want to be able to resolve records from the store without being forced to understand the internals of ember-data's data structure.

iOS dev Over a year ago

Hey @ken Did you get the solution. I'm facing the same problem. Couldn't access directly the model attributes instead I'm forced to access using the nested stuff as mentioned above

ken Over a year ago

truth be told, i don't remember @nagarjuna . sorry I couldn't be more help.

Collectives™ on Stack Overflow

Getting data out of Ember-data

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related