ngload support for module splitted across multiple files

Question

ngload support for module splitted across multiple files

Closed this issue 10 years ago · 13 comments

Is ngload capable of loading AMD module (define wrapped)? I am asking because there is just a one plain JS file (dataService.js) in examples (I want to have the module splitted across multiple files and state them as dependencies in module entry point).

by @smajl

Answer 1 · 2014-04-13T12:29:38.000Z

Interesting question. ngload is not designed to load module created using angular.module where the definition of that specific module is split across multiple files. What ngload is doing is basically by passing the creation of the module and internally calling methods behind app.register. However, it might not be that hard to change angularAMD to make this work.

Can you (@smajl) share your use case of why you would need a different module, instead of simply calling app.register?

Answer 2 · 2014-04-13T14:58:42.000Z

We now have only one angular.module entry point and then bunch of controllers, directives, etc. which we are registering with angularAMD.

But then I feel like missing the natural ability to split application in separate swappable modules with per module configuration blocks (like routing etc.). Although I guess I could mimic module like behaviour with controllers that will include all the "module" dependencies and assign them to routes.

I believe that ngload is able to load angular.module but only with non-AMD compliant single files like dataService.js from docs.

It would be absolutely terrific to be able to do something like this when defining routes:

$routeProvider.when("/app/dashboard", angularAMD.route({
  templateUrl: 'modules/dashboard/dashboard.tpl.html',
  moduleUrl: 'modules/dashboard/dasboard.module' // define wrapped angular.module with own dependecies, routing and so on...
  controller: 'Dashboard', // name of controller defined and registered in dashboard.module
})...

Answer 3 · 2014-04-14T06:53:11.000Z

The way I currently do this is as you described: I have a "controller" loaded by $routeProvider that would inject multiple components, some of those reusables. I do not redefine the route yet but I am assuming that I need a ui-router for that.

If you request is to be able to load a AMD compliant package, in which case ngload is not needed, this would be similar to #34.

Answer 4 · 2014-05-28T04:55:33.000Z

No further reply from user. Assuming that this is a duplicate of #34.

Answer 5 · 2014-05-28T09:25:18.000Z

I switched to another lazy loading plugin for Angular which better suits my needs. Thanks anyway. :)

Answer 6 · 2014-06-16T20:35:07.000Z

@smajl - what did you end up going with?

Answer 7 · 2014-06-17T21:30:57.000Z

@amcdnl I now use ocLazyLoad. Combined with ui-router and RequireJS, it's really great. :)

Answer 8 · 2014-06-18T11:38:19.000Z

@smajl yup thats what i ended up using too, just got it in and working great so far :)

Answer 9 · 2014-06-18T12:36:47.000Z

@smajl/@amcdnl: can you share with me the pros of ocLazyLoad? I would really appreciate feedback. Thanks in advance.

Answer 10 · 2014-06-19T19:19:41.000Z

@marcoslin I like maybe these 5 things the most:

You declare all you modules, as you would normally do in plain Angular way. No need to write everything as yourMainAppModule.register.... You can lazy load all your current code just now (assuming you are writing AMD modules).
That means you can also easily load other third party AMD modules with no hassle.
Handy $ocLazyLoad service which you use in routes resolves, your directives, etc. E.g. I can imagine using it for preloading code when users cursor gets in vicinity of some UI element, etc.
You are writing standard modules, so infinite config and run blocks (easy to put module relevant routing directly in it).
You can preload HTML and CSS too (but I am not using that yet).

Hope that helps in improving angularAMD. :)

Answer 11 · 2014-06-19T20:56:25.000Z

@smajl thanks for the feedback. Really appreciated.

Answer 12 · 2014-09-29T13:43:47.000Z

@smajl / @amcdnl do you have a demo of your setup? Really curious to see it.

Answer 13 · 2014-09-30T15:34:14.000Z

@DarrylD Actually, I ended also using ui-router-extras and it's "future state" ability. They have example here (http://christopherthielen.github.io/ui-router-extras/example/future/index.html#/). They even use angularAMD with ngload in their example as default loader. It's easy to tweak it to ocLazyLoad if you wish and it works very good. I hope you can get the idea from their page.