Deprecation Guide for Rendering into a {{render}} helper that resolves to an {{outlet}}

Before named outlets were introduced to Ember the render helper was used to declare slots for this.render in routes. This usage is not common in modern, idiomatic applications and is deprecated. In general, the pattern of named outlets or named render helpers is discouraged. Instead use of ember-elsewhere or another DOM-redirection library should better serve these use cases.

For example this code uses the render helper as a target for a special sidebar present on the index route. The special sidebar is in a template named index-sidebar:

<div class="sidebar">{{render 'sidebar'}}</div>
<div class="main">{{outlet}}</div>

Index Content

App.IndexRoute = Ember.Route.extend({
  renderTemplate() {
    this._super(...arguments);
    this.render('index-sidebar', { into: 'sidebar' });
  },
  actions: {
    willTransition() {
      this.disconnectOutlet({
        parentView: 'application',
        outlet: 'sidebar'
      });
    }
  }
});

It should be refactored to use ember-elsewhere. The sidebar content must be implemented as a component, in this case named index-sidebar. The logic previously used in the route file can be removed. The refactored example:

<div class="sidebar">{{from-elsewhere name='sidebar'}}</div>
<div class="main">{{outlet}}</div>

{{to-elsewhere named='sidebar' send=(component 'index-sidebar')}}
Index Content

For more informations of how to use ember-elsewhere, please visit the official documentation here.