CODEWITHSUNDEEP
ember.js
Anthony
Anthony

Reputation: 35978

How to position the default loadingroute in emberjs

EmberJS provides a loadinroute which can be used to render a spinner etc. while the promise is being processed.

By default it processes under the {{outlet}}. I'm wondering if there is a way to position the render to someplace else?

For example in this jsbin: http://jsbin.com/ixazeb/8/edit I want to position the loading... on top of the App text.

I've tried to tap into the renderTemplate like this:

App.LoadingRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render({ outlet: 'sidebar' });
  }
});

and using it in my template like this: {{outlet sidebar}} but that didn't work.

Upvotes: 1

Views: 271

Answers (1)

Marcio Junior
Marcio Junior

Reputation: 19128

You need to provide the target template name to append the loading template, using into: 'application'

App.LoadingRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render('loading', {
      outlet: 'loading',
      into: 'application'
    });
  }
});

Now it works http://jsbin.com/ixazeb/14/edit

Upvotes: 2

Related Questions