Question

I have a Route for creating new documents, making a copy of an existing document.

App.DocumentsNewRoute = Ember.Route.extend({
  model: function (params) {
    this.modelParams = params; // save params for reference
    return App.Document.createRecord();
  },
  setupController: function (controller, model) {
    // use the params to get our reference document
    var documentModel = App.Document.find(this.modelParams.document_id);

    documentModel.one('didLoad', function () {
      // once loaded, make a serialized copy
      var documentObj = documentModel.serialize();

      // and set the properties to our empty record
      model.setProperties(documentObj);

      console.log('didLoad');
    });
  }
});

I added some logs in my View.

App.DocumentView = Ember.View.extend({
  init: function () {
    this._super();
    // fires before the didLoad in the router
    console.log('init view');
  },
  willInsertElement: function () {
    // fires before the didLoad in the router
    console.log('insert elem');
  }
});

And this is my template

{{#if model.isLoaded }}
  {{ view App.DocumentView templateNameBinding="model.slug" class="document portrait" }}
{{ else }}
  Loading...
{{/if}}

The problem it seems is that my model isLoaded, but not populated when my template is rendered, so the templateNameBinding doesn’t exist at this point, and doesn’t seem to be updated when the data gets populated.

Should I use something else than model.isLoaded in my template, or should I force a re-render of my template, and if so, how and where? Thanks!

Answer 1

It seem that you are overcomplicating the things. It should be:

EDIT

I misunderstood your question in first read, so

App.DocumentsNewRoute = Ember.Route.extend({
    model: function (params) {
        var originalDoc = App.Document.find(params.document_id),
        newDoc = App.Document.createRecord();
        originalDoc.one('didLoad', function () {
             newDoc.setProperties(this.serialize());
        });
        return newDoc;
    },
    setupController: function (controller, model) {
        controller.set('content', model);
    }
});

If everything is right, ember will re-render things automatically..