title: Ember.js - how to render default outlet in a component view
body: <p>I have a reused component view called 'box-modal.js' in <strong>/app/templates/components/box-modal.js</strong>.
  It contains an outlet in which I want to render a default template.</p>
  
  <pre><code>&lt;div&gt;
    {{outlet main}}
  &lt;/div&gt;
  </code></pre>
  
  <p>The template I want to render as default in the outlet is in <strong>/app/templates/default_box.hbs</strong></p>
  
  <p>I know that you can use renderTemplate function in a router file for regular templates but it's not working for component templates:</p>
  
  <p><strong>/app/routes/components/box-modal.js</strong></p>
  
  <pre><code>import Ember from "ember";
  
  var BoxModalRoute = Ember.Route.extend({
    renderTemplate: function() {
      this.render('default_box', {
        into: 'components.box-modal',
        outlet: 'main'
      });
  }
  export default BoxModalRoute;
  </code></pre>
  
  <p>Is there a standardized way for template rendering in component views in Ember-cli?</p>