Ember Loading Template never displaying

I have tried

/app/routes/loading.hbs
/app/pods/loading/template.hbs
/app/pods/loading.hbs
/app/pods/application/loading/template.hbs
/app/pods/application/loading.hbs
/app/templates/loading.hbs
/app/templates/application-loading.hbs

None of the above ever work.

I added this to my application route and it works, but it is only rendering the spinner in the application template not the outlet not the appropriate outlet of the current route.

  //app/pods/application/template.hbs
  {{#if isLoading}}
      <i class="fa fa-spinner fa-pulse fa-5x"></i>
  {{/if}}

  //app/pods/application/roue.js
  actions: {
    loading(transition, originRoute) {
      let controller = this.controllerFor('application');
      controller.set('isLoading', true);
      transition.promise.finally(function() {
        controller.set('isLoading', false);
      });
    }
  }

What amy I doing wrong? Why are the templates not rendering? I am using ember-cli@2.4.2 with ember@2.4.1