Note that there are some explanatory texts on larger screens.

plurals
  1. POSerialize is reached before server response is complete
    primarykey
    data
    text
    <p>In my ember app, I have a router with nested resources, like so:</p> <pre><code>App.Router.map(function () { this.resource('explore', function() { this.resource('building', { path: 'building/:slug' }); this.resource('country', { path: ':slug' }, function() { this.resource('state', {path: ':slug' }); }); }); }); App.CountryRoute = Ember.Route.extend(App.SlugRouter, { setupController: function(controller, country) { controller.set('title', 'country detail'); controller.set('model', country); } }); App.SlugRouter = Ember.Mixin.create({ serialize: function(model, params) { var name, object; object = {}; name = params[0]; object[name] = model.get('slug'); return object; } }); App.Building = DS.Model.extend({ country: DS.belongsTo('App.Country'), name: DS.attr('string'), slug: DS.attr('string') }); App.Country = DS.Model.extend({ name: DS.attr('string'), slug: DS.attr('string'), buildings: DS.hasMany('App.Building'), states: DS.hasMany('App.State') }); </code></pre> <p>Loading the explore route shows a list of buildings received from the server (a django-rest-framework app), each building has a relationship to a country with a belongsTo attribute. </p> <p>In the explore.index route, I display the list of the buildings, with links to the country route for each building, using <code>{{linkTo this.country}}</code>. The href, however, is loaded as <code>#/explore/undefined</code>, instead of <code>#/explore/&lt;country-name&gt;</code>.</p> <p>The part that is confusing me is that this only happens the first time that I load the list. If I go to another route, then come back to <code>#/explore</code>, the links render correctly. </p> <p>In the debugger, putting a breakpoint in the serialize method, I see that the first time that I load the page, the model object is empty (_data.attributes is an empty object). Going to the network tab in the debugger, I see that the a request has been made to the server to get the country data, but the response has not been received yet:</p> <p><img src="https://i.stack.imgur.com/m2GK3.png" alt="server response not received yet"></p> <p>The response is eventually received, since <code>{{this.country.name}}</code> renders correctly, but after it's too late. </p> <p>Thanks in advance for any responses/tips. </p> <p>I am using: Ember: 1.0.0-rc.5, Handlebars: 1.0.0-rc.4, jQuery: 1.8.3, ember-data: 0.13, ember-data-django-rest-adapter: 0.13</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload