Ember / pull in data from multiple sources in one route

Question

I am using the latest Ember.js and WP-API for a project. Everything is dandy on most pages, but one I tried to get data from different end-points onto the same page - I became lost. For example, I pull in the page {{title}} and maybe some text for an intro. THEN I want to pull in the "projects" in a list below - but I'm unsure of how to get that into the model / route --- doesn't seem like views are the right direction, and nested routes could switch stuff out / but wouldn't really be in the same "page" / route.

Point me in the right direction? : )

(assume that ic.ajax and Ember etc are all imported CLI style)

var siteUrl = 'http://some-site.com/wp-json';

export default Ember.Route.extend({

  model: function() {

    var simplePageData = ajax({
      url: siteUrl + '/pages/landing',
      type: 'GET'
    });

    console.log(simplePageData);
    return simplePageData;
  }

});

possible duplicate of [EmberJS: How to load multiple models on the same route?](http://stackoverflow.com/questions/20521967/emberjs-how-to-load-multiple-models-on-the-same-route) — albertjan, Apr 02 '15 at 06:13

score 0 · Answer 1 · answered Apr 02 '15 at 09:19

Assuming you already have a projects controller/route, then in your controller that you want to also load the projects (let's call it a dashboard), you can use 'needs', e.g.

// controllers/dashboard.js
export default Ember.Controller.extend({
  needs: ['projects'],

  projects: Ember.computed.alias('controllers.projects.model'),
});

then in your template you can just access the projects:

// templates/dashboard.hbs
{{#each projects as |project|}}
  {{!-- your awesome code for a list of projects here --}}
{{/each}}

extra reading about this can be found here.

Ember / pull in data from multiple sources in one route

1 Answers1