How to load parts of Ember.js on demand?

Question

I want to load parts of my Ember.js application on demand (app is structured with AMD but merged into a few big script files for production).

An example:

Browse to '/'

The user starts at /, the HTML loads the file core.js which contains Ember.js, the routings and the application controller + view.

Browse to '/user/settings'

So now the user browses to /user/settings for the first time. The views, controllers and templates for this are in user.js which is loaded via a script loader in the according route:

App.UserRoute = Em.Route.extend({
  enter: function(ctx) {
    this.ajaxLoadFiles("user.js", function() {
      // ???
    });
  }
});

Problem

Somehow Ember.js needs to wait for the script to load and then continue routing ... how do I do this?

For the templates part, this may help: http://stackoverflow.com/q/9469235/90741 — Mike Aski, Dec 09 '12 at 09:29
Thanks :) -but I'm really looking for a "complete package" solution — stephanos, Dec 09 '12 at 20:05
NOTE: completely rewrote the question to make actual issue clearer — stephanos, Feb 23 '13 at 19:07

score 1 · Answer 1 · edited May 23 '17 at 11:43

1

I am using require.js, it is great for modularising your code!

You can clone the todoMVC AMD version to study here

https://github.com/addyosmani/todomvc/tree/gh-pages/dependency-examples/emberjs_require

for further advice, see this post:

Is there any way to split an Ember.js app across a few files?

edited May 23 '17 at 11:43

Community

1
1

answered Jan 03 '13 at 15:52

Shane Davis

952
1
6
22

I use require.js already :) The issue of the question is not how to just split the files - but how do LOAD them in the end. – stephanos Jan 03 '13 at 18:13

How to load parts of Ember.js on demand?

1 Answers1