How do you get a Loading template in ember-cli PODS?

Question

I've seen this url Ember-cli Pods & Loading Templates but adding a /app/bugs/loading.hbs or /app/bugs/detail/loading.hbs or even /app/bugs/detail/loading/template.hbs doesn't work.

What is the specific name/path of the template?
Its my understanding loading/error/index routes are generated automatically when you add an additional functions in this.route('bugs', function(){})

I'm missing something probably easy - any thoughts?

unfortunately they don't touch upon pods there at all - and thats the guide for ember 2.2. Also their code uses controller.set, though they say controllers will soon be deprecated (granted its not a controller directly but i'm assuming auto generated one) - would be nice if docs explained this further. Ive added their loading code to /bugs/index/route.js and nothing ever fires (and Ive put a delay into my api of 7 seconds) — Adam Tuliper - MSFT
I've been able to get the template rendering from watching the console log the resolver. I created /bugs/index-loading/template.hbs and that shows up, and the code goes in /bugs/index.route.js. Im assuming their mention of controllers was 'just in case you happen to use them here's how you can set some value in them' which is a bit confusing as I'm not sure if "currentlyLoading" is something reserved from reading that. — Adam Tuliper - MSFT
The guides don't mention pods because they aren't final yet and are going to change, so the classic structure is still the recommended one. When final pods land we'll update accordingly. Here's a presentation on them: youtu.be/1wc3a_ttTy0?t=28m18s — locks
Only works on nested routes, application level load/error substates wont work. See : Nesting loading under application doesn't work · Issue #13053 github.com/emberjs/ember.js/issues/13053 — Alan Dong

Adam Tuliper - MSFT Adam Tuliper - MSFT · Accepted Answer · 2016-01-12T08:55:55

Since the docs don't specifically mention pods and I've seen a few people pose this question on the net using what seems like an older folder structure, I'll answer here.

For my /bugs route I have the following at

./app/bugs/index/route.js

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return this.store.findAll('bug');
    },
    actions: {
    loading(transition, originRoute) {
        console.log('loading transition');
        console.log(originRoute);
        //let controller = this.controllerFor('bugs');

        //controller.set('currentlyLoading', true);
        transition.promise.finally(function () {
            console.log('done loading');
            //controller.set('currentlyLoading', false);
        });
      }   
    }
});

The loading template it looks for is located at

./app/bugs/index-loading/template.hbs

How do you get a Loading template in ember-cli PODS?

1 Answers