Search code examples
ember.jsember-dataember-app-kit

Ember App Kit with ember data


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?


Solution

  • 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