Ember.js - how to render default outlet in a component view

I have a reused component view called 'box-modal.js' in /app/templates/components/box-modal.js. It contains an outlet in which I want to render a default template.

<div>
  {{outlet main}}
</div>

The template I want to render as default in the outlet is in /app/templates/default_box.hbs

I know that you can use renderTemplate function in a router file for regular templates but it's not working for component templates:

/app/routes/components/box-modal.js

import Ember from "ember";

var BoxModalRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render('default_box', {
      into: 'components.box-modal',
      outlet: 'main'
    });
}

Is there a standardized way for template rendering in component views in Ember-cli?