Where is fixture data in ember.js with cli

Question

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.

Answer 1

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;

Answer 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

Answer 3

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

Answer 4

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.