Ember App Kit with ember data

Question

I'm trying to start a new project with ember app kit and ember data using ES6. I've managed to create a store using the following code in adapter.js

var ApplicationAdapter = DS.FixtureAdapter.extend();
export default ApplicationAdapter;

However, I'm failing to create a model and access it. In models/account.js I have this

var Account = DS.Model.extend({
  name: DS.attr('string')
});

Account.FIXTURES = [
  {
    'id': 1,
    'name': 'Acc 1'
  }, {
    'id': 2,
    'name': 'Acc 2'
  }
]

export default Account;

and in my routes/accounts.js I have this:

var AccountsRoute = Ember.Route.extend({
  model: function() {
    var store = this.get('store');
    return store.find('account');
  }
});
export default AccountsRoute;

At this stage I'm simply trying to get a list of accounts from the fixtures displayed on screen. The route works nicely and if I put in static data (like the index route) then all works fine. However, with the code above, I run into trouble

DEPRECATION: Action handlers contained in an `events` object are deprecated in favor of putting them in an `actions` object (error on <Ember.Route:ember352>)
    at Object.triggerEvent (http://localhost:8000/vendor/ember/index.js:30519:13)
    at trigger (http://localhost:8000/vendor/ember/index.js:29641:16)
    at handleError (http://localhost:8000/vendor/ember/index.js:29903:9)
    at invokeCallback (http://localhost:8000/vendor/ember/index.js:8055:19)
    at null.<anonymous> (http://localhost:8000/vendor/ember/index.js:8109:11)
    at EventTarget.trigger (http://localhost:8000/vendor/ember/index.js:7878:22)
    at http://localhost:8000/vendor/ember/index.js:8180:17
    at Object.DeferredActionQueues.flush     (http://localhost:8000/vendor/ember/index.js:5459:24)
    at Object.Backburner.end (http://localhost:8000/vendor/ember/index.js:5545:27) index.js:394
Error while loading route: 
Object {readyState: 4, getResponseHeader: function, getAllResponseHeaders: function,   setRequestHeader: function, overrideMimeType: function…}
 index.js:394
Uncaught #<Object> index.js:30566

Where am I going wrong?

Answer 1

Your Account model is using the DS.RESTAdapter instead of the DS.FixtureAdapter, because you are setting the adapter in ApplicationAdapter, the expected is AccountAdapter. So you receive an error from the ajax, probably because the url does not match a server.

To configure the DS.FixtureAdapter per model use:

var AccountAdapter = DS.FixtureAdapter.extend();
export default AccountAdapter; 

Or as global adapter for all models:

App.Store = DS.Store.extend({
    adapter: DS.FixtureAdapter
});

I hope it helps

Answer 2

I think the real issue was that you defined your Fixture Adapter in adapters/adapter.js.

When you called:

store.find('account');

It correctly found the model but then looked for the correct adapter. You don't have an adapters/account.js so it used the application default, which has been mentioned is a RESTAdapter.

To get your example working, just change the filename.

Answer 3

I was getting the same error...

However I was able to fix this by importing my ApplicationAdapter, and using that to define my store:

app/adapters/application.js:

var ApplicationAdapter = DS.FixtureAdapter.extend();

export default ApplicationAdapter;

app/store/application.js:

import ApplicationAdapter from 'appkit/adapters/application';
var Store = DS.Store.extend({
    adapter: ApplicationAdapter
});

export default Store;

Keep in mind I have not changed the default application name away from appkit yet, you may have to change this name or the paths to make this function properly for you.