Ember-data return a single json object with store.find

Question

Is this possible? I know I can do:

this.store.find('model', 1)

but that's not what I want. I would like to retrieve the json in this format: (working if I retrieve it in the route like this ):

App.OptionsRoute = Ember.Route.extend({
model: function () {
    return {
        "options":{

            "id": "1",
            "headline": "A Headline",
            "results": [

                {
                    "id": "1",
                    "title": 'Option 1',
                },
                {
                    "id": "2",
                    "title": "Option 2"
                }
            ]
        }

    };
}
});

options model:

App.Options = DS.Model.extend({
headline: DS.attr(),
results: DS.attr()
});

options.hbs

    <h5>{{options.headline}}</h5>

    {{#each item in options.results}}
        <h5>{{item.title}}</h5>
    {{/each}}

I am using the RESTAdapter. And that is the only model that will be retrieved on that route. I would like to be able to use ember-data, but store.find expects an array.

Is Option a model? Can you share your related models(parent model and child model[included in results]) and relationships code? Are you using RESTAdapter? — Daniel Kmak
@Daniel - I updated my question with some more details. Do you know if my data structure is compatible with ember-data or if I need to make adjustments based on the code I provided? — Operator

Daniel Kmak Daniel Kmak · Accepted Answer · 2015-01-28T00:42:43

You're missing a point here. First of all you're using bad format for your response. You need custom serializer. You can also use a bit more dirty workaround like this(but it works). Route:

App.OptionsRoute = Ember.Route.extend({
  model: function() {
    that = this; 
    return new Promise(function (resolve, reject) {
      url = that.store.adapterFor('option').buildURL('option');
      Ember.$.getJSON(url).then(function (json) {
      body = json.options;
      correct = {
        options: [
          body
        ]
      };
      that.store.pushPayload('option', correct);
      resolve(that.store.all('option').get('firstObject'));
    });
    });
  }
});

Template:

<h5>{{model.headline}}</h5>

    {{#each item in model.results}}
        <h5>{{item.title}}</h5>
    {{/each}}

Application outputs:

A Headline
Option 1
Option 2

Working demo - please notice that I'm using $.mockjax to recreate your response from server, but it matches format you provided.

Ember-data return a single json object with store.find

1 Answers