ember-cli App.get / App.set throw undefined

Question

I'm converting a globals based real-time Ember app to an es6 based app that utilizes ember-cli. In my app I need to know the current route fairly often. In the globals version, I was doing this.

Globals Pattern

var MyApp = Ember.Application.create({
    currentRoute : ''
});

MyApp.Route = Ember.Route.extend({
    actions : {
        didTransition : function () {
            MyApp.set('currentRoute', this);
        }
    }
});

I could then do MyApp.get('currentRoute') from within my session or offline controllers when determining how / where to transition when certain events occurred.

When using ember-cli, I import the app to be able to reference it from the necessary controllers.

import MyApp from "../app";

But it turns out that MyApp.currentRoute, MyApp.get, and MyApp.set are all undefined.

Part of me thinks this is a bug in ember-cli that the application instance no longer has bound getters and setters. Part of me realizes it's not a great practice to store things on the application instance either.

I could get around this issue by converting all instances of MyApp.get and MyApp.set to Ember.get(MyApp, ...) and Ember.set(MyApp, ...) respectively, but I thought I'd ask here first as this seems to either be an issue with Ember-Cli or else something where there's a better recommended way to achieve what I need.

Answer 1

If you look at app.js (what you are importing), it is not your application instance, it is exporting a subclass of Ember.Application. That's why get et al are not available on it.

var App = Ember.Application.extend({   <----- NOT create
    modulePrefix: config.modulePrefix,
    podModulePrefix: config.podModulePrefix,
    Resolver: Resolver
});

export default App;

To get the actual application instance from within your route use:

Ember.getOwner(this).lookup('application:main')