7

I'm trying to use fixture data in an ember app generated with cli. I can't find my data. The inspector shows I have a model called post but nothing in it. I'm not sure why it's not working so posting the files that I think are relevant...

models/post.js

var Post = DS.Model.extend({
    title: DS.attr('string'),
    content: DS.attr('string'),
    publishDate: DS.attr('date')
});

Post.reopenClass({
    FIXTURES: [
        {
            id: 1,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        },
        {
            id: 2,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        }
    ]
});

export default Post;

router.js

var Router = Ember.Router.extend({
  location: ENV.locationType
});

Router.map(function() {
    this.resource('posts', { path: '/' });
});

export default Router;

routes/index.js

export default Ember.Route.extend({
    model: function() {
        return this.store.find('post');
    }
});

controllers/posts.js

var PostsController = Ember.ArrayController.extend({

});

export default PostsController;

templates/posts.hbs

<p>Test</p>
<ul>
    {{#each}}
        <li>
            {{title}}
        </li>
    {{/each}}
</ul>

I think this problem is ember-cli specific. I have got fixtures working with Ember App Kit before but want to work with ember-cli. I added and adapter and tried changing the way fixtures were declared:

adapters/post.js

var PostAdapter = DS.FixtureAdapter.extend({});

export default PostAdapter;

Changed models/post.js

var Post = DS.Model.extend({
    title: DS.attr('string'),
    content: DS.attr('string'),
    publishDate: DS.attr('date')
});

Post.FIXTURES = [
        {
            id: 1,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        },
        {
            id: 2,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        }
    ];

export default Post;

This still doesn't work. Ember inspector shows posts with correct fields (id, title, content publishDate) but no actual data.

brownie3003
  • 538
  • 7
  • 16

4 Answers4

19

I needed to add my fixture adapter in:

adapters/application.js

export default DS.FixtureAdapter.extend({});

And then it worked with the reopenClass version of fixtures:

models/post.js

var Post = DS.Model.extend({
    title: DS.attr('string'),
    content: DS.attr('string'),
    publishDate: DS.attr('date')
});

Post.reopenClass({
    FIXTURES: [
        {
            id: 1,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        },
        {
            id: 2,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        }
    ]
});

export default Post;
brownie3003
  • 538
  • 7
  • 16
  • Using `reopenClass` is the correct method, not the selected answer above. See http://edgycircle.com/blog/2014-using-fixtures-in-combination-with-ember-cli/ – Scott Fister Jul 08 '14 at 21:57
  • The mistakes I made when setting fixtures up with ember-cli: forgot to add a fixture adapter, tried doing `.FIXTURES` instead of `reopenClass`, forgot to `.find` the model (I was under the impression that ember (ember-data?) can automatically provide a model in the standard case). I think two things would make this easier: the generator should provide a default model for the route, and there should be a fixture generator for ember-cli. – blueFast Oct 20 '14 at 11:01
2

In addition to the above reopenClass method call, you also need to add to your Brocfile.js the import for EmberData

You can do it like so:

app.import({
  development: 'vendor/ember-data/ember-data.js',
  production:  'vendor/ember-data/ember-data.prod.js'
}, {
  'ember-data': [
    'default'
  ]
});

Thanks to this nicely put together post for helping me realise this: http://www.blakeerickson.com/posts/2014/06/17/ember_cli_todomvc_tutorial

Peter O'Brien
  • 185
  • 1
  • 7
  • Why would you need to add `ember-data` if you only want to test with fixtures? – blueFast Oct 17 '14 at 15:28
  • 1
    I haven't had my head in Ember for awhile (and didn't get to go that deep when I did) but the FIXTUREADAPTER is a part of ember-data. The above fixed it for me in ember-cli at the time which was ~v0.0.36. Think they've moved ember-cli on a fair way of late (now at v0.1.2 by looks of it), so things may have changed. – Peter O'Brien Oct 21 '14 at 15:46
  • You are right, I was confused: fixtures is one of the adapters supported by `ember-data`. – blueFast Oct 21 '14 at 16:27
0

Accepted answer is the right way, but you can generate files in ember-cli way:

ember g adapter application

It generates:

installing adapter
  create app/adapters/application.js
installing adapter-test
  create tests/unit/adapters/application-test.js
jare25
  • 506
  • 1
  • 7
  • 17
-1

You need to define fixtures as:

Post.FIXTURES = [
        {
            id: 1,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        },
        {
            id: 2,
            title: "Writing a blog in Ember",
            content: "I am writting a blog",
            publishDate: "05/22/2104"
        }
];

And you must also setup ApplicationAdapter:

App.ApplicationAdapter = DS.FixtureAdapter;

Here an example http://emberjs.jsbin.com/yutas/1/edit and the guide section.

ppcano
  • 2,831
  • 1
  • 24
  • 19
  • I tried changing it to that and also adding a fixture adapter (edited the question) and still no luck. The way you've shown works with ember app kit, but I'm trying to work with cli. I want to keep the folder structure & modules that cli provides and not have everything in one js file. – brownie3003 May 24 '14 at 09:35
  • Added ApplicationAdapter setup to the response. – ppcano May 25 '14 at 08:11