Ember js : load multiple template on one page with data

Question

I am working on a application in ember.js . I have an few questions to all of you guys. First lets discuss about my application points and then what problem I am facing in.<

Answer 1

I believe what you want to do here is something like this... You need to create a route, say HomeAndContact. In this route create a template. You have 2 options here, make the template something like:

{{outlet 'home'}}
{{outlet 'contact'}}

Or you could also just do:

{{render 'home'}}
{{render 'contact'}}

I would advise against the second option because it will be deprecated/is not aligned with what Ember is doing going forward.

To do the first option, you will need to have some code like this in your HomeAndContactRoute:

HomeAndContactRoute = Ember.Route.extend({
  setupController: function(controller, model) {
    this.controllerFor('home').set('model', model);
    this.controllerFor('contact').set('model', model);
  },
  renderTemplate: function() {
    this.render('home', {           // the template to render
      into: 'homeAndContact',       // the template to render into
      outlet: 'home',              // the name of the outlet in that template
      controller: 'home'        // the controller to use for the template
    });
    this.render('contact', {
      into: 'homeAndContact',
      outlet: 'contact',
      controller: 'contact'
    });
  }
});

I hope this helps.