0

I'm trying to feed a template:

<script type="text/x-handlebars" data-template-name="wineries">
{{#each}}
<p>{{name}}</p>
{{/each}}
</script>

With that route: (look for the comment)

Map.WineriesRoute = Ember.Route.extend({
    model: function() {
        var store = this.get('store');

        return Ember.$.getJSON('/api/wineries').then(function(response) {
            if (response.success) {
                response.data.forEach(function(winery) {
                    store.push('winery', winery);
                });
            }
            // what to do here?
            return store.findAll('winery');
        });
    }
});

And that model:

Map.Winery = DS.Model.extend({
    name:          DS.attr('string'),
    address:       DS.attr('string'),
    address_2:     DS.attr('string'),
    city:          DS.attr('string'),
    stateprovince: DS.attr('string'),
    country:       DS.attr('string'),
    latitude:      DS.attr('float'),
    longitude:     DS.attr('float'),

    full_address: function () {
        return this.get('address') + ' ' + this.get('city') + ' ' + this.get('stateprovince') + ' ' + this.get('country');
    }.observes('address', 'city', 'stateprovince', 'country')
});

I'm getting started with Ember.js and reading LOTS of docs but I'm stuck as I don't know how to handle the store too much even after reading the doc page.

1) What should I do to properly feed the store with the objects? 2) What should I do to properly return the objects after having fed the store? 3) Any other ember-related suggestions?

EDIT:
It seems ember-data isn't what I'm looking for, ember-model seems more fitting for my use-case.

Thanks!

Tommy B.
  • 3,591
  • 14
  • 61
  • 105

2 Answers2

2

First of all: Why do load and push your server data "manually"?

Using DS.RESTAdapter or DS.ActiveModelAdapter you can let ember-data load your items automagically from a REST API. See here for more details.

Your could then simplify your route class like this:

Map.WineriesRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('winery');
    }
});
Mutual Exception
  • 1,240
  • 12
  • 27
  • I was doing so because I'm using ember.js to enhance an already existing app. So the API is frozen as it is, which is why I was getting stuff with $.get and trying to fill the store with it. I'll see if I can tweak the API to meet ember's requirements but what if I couldn't? How could I achieve this anyways? Thanks! – Tommy B. Oct 16 '13 at 13:23
  • Also: if I do what mentioned in the article with an object like "winery" it tries to fetch "/winerys" any way of renaming that part of the URI? Thanks – Tommy B. Oct 16 '13 at 13:26
  • It seems ember-data isn't what I'm looking for, ember-model seems more fitting for my use-case. – Tommy B. Oct 16 '13 at 13:57
  • It is also important to know, whether you have to write your data back to the server. If your API works in a RESTful way (POST, PUT and DELETE) it definitely makes sense to try to tweak RESTAdapter. Otherwise you could consider using DS.FixtureAdapter. In that case you would initialize the fixtures with an empty array. But you could fill it when the app is ready (see also http://stackoverflow.com/a/19401072/1345947). The code for your route class would still be the same as in my answer. – Mutual Exception Oct 16 '13 at 15:32
1

TomShreds - if you use the RESTAdapter as Mutual Exception suggests (which I advise too), then you can manually set how models are pluralized:

DS.RESTAdapter.configure("plurals", { winery: "wineries" });

Original answer here: Where do I specify the pluralization of a model in Ember Data?

Community
  • 1
  • 1
sjmog
  • 159
  • 5