title: Template inheritance in Ember
body: <p>I have several unrelated pages that use Layout A, and another set of unrelated pages that use Layout B. It's as simple as that, but I can't figure out how to do this in Ember the DRY way.</p>
  
  <p>I understand that template nesting is equal to route nesting, but I do not want to nest routes because it'd mean the URL will be also nested. I want to nest templates only because the pages are unrelated.</p>
  
  <p>What I want to achieve is essentially template inheritance.</p>
  
  <p>I expected this to work, but Ember throws an error.</p>
  
  <pre><code>// app/routes/samePage.js
  import Ember from 'ember';
  
  export default Ember.Route.extend({
      renderTemplate(){
          this.render('somePage', {
              into: 'layoutA'
          });
      }
  });
  </code></pre>
  
  <p>This is the error I get:</p>
  
  <p><code>ember.debug.js:18015 Assertion Failed: You attempted to render into 'layoutA' but it was not found</code></p>
  
  <p>I also get this warning. It tells me to read <a href="http://emberjs.com/deprecations/v2.x/#toc_rendering-into-a-render-helper-that-resolves-to-an-outlet" rel="nofollow noreferrer">this link</a>, but I don't think it helps me.</p>
  
  <p><code>DEPRECATION: Rendering into a {{render}} helper that resolves to an {{outlet}} is deprecated. [deprecation id: ember-routing.top-level-render-helper] See http://emberjs.com/deprecations/v2.x/#toc_rendering-into-a-render-helper-that-resolves-to-an-outlet for more details.</code></p>
  
  <p>Here is what <code>layoutA.hbs</code> would look like. I know you can't have <code>{{outlet}}</code> multiple times in a same template, but you probably get what I want to achieve.</p>
  
  <pre><code>&lt;div class="header"&gt;
      {{outlet}}
  &lt;/div&gt;
  &lt;div class="content"&gt;
      {{outlet}}
  &lt;/div&gt;
  &lt;div class="footer"&gt;
      {{outlet}}
  &lt;/div&gt;
  </code></pre>
  
  <p>How do I go about doing this in Ember? It sounds like such a basic task that needs to be more clear. Do I need to implement a template inheritance helper (like the one shown <a href="https://gist.github.com/Wilfred/715ae4e22642cfff1dbd" rel="nofollow noreferrer">here</a>) by myself? Or perhaps, there's already an Ember add-on for that?</p>