1

I have an Angular app. I am creating different widgets in HTML5 as follows.

<html ng-app>
  <div ng-controller="widget1">
  </div>

  <div ng-controller="widget2">
  </div>
</html>

How do I autoload widget1.js and widget2.js whenever they appear in the markup? I don't want to stuff <script> tags in the header for each widget. I am new to Angular. How is it actually handled?

Thanks!

Sanket Sahu
  • 8,468
  • 10
  • 51
  • 65
  • AngularJS does not support lazy loading of controllers, but you can achive it using RequireJS, check out my answer to this question: http://stackoverflow.com/questions/13504452/add-directive-to-module-after-bootstrap-and-applying-on-dynamic-content/13520852#13520852 (link to working example included in the answer) – matys84pl Feb 18 '13 at 16:10

1 Answers1

0

Wouldn't a directive be a better option then? You could place the contents of widget1.js and widget2.js in the respective link functions. That way they will only be loaded if the directive is in the markup.

Or so I believe, someone please correct me if I'm wrong.

winkerVSbecks
  • 1,173
  • 1
  • 10
  • 24