2

When $compile-ing an angular HTML template string I'm trying to put additional controllers and directives inside a <script> tag and use those in the HTML template.

This way I'm essentially trying to implement some sort of plug-in-mechanism, so that I can load external files that augment my app's functionality.

The <script> tag does actually get evaluated, but my problem is, that the HTML template compilation takes place before the evaluation of the JavaScript. So the compiler complains about missing controllers.

Example:

http://plnkr.co/edit/8oZYhRHAjP84ecnl6hG3?p=preview

This example throws an error: Error: Argument 'Controller' is not a function, got undefined

If you delete lines 15-18 (the HTML that references the created conroller) in app.js, you can see in the console that creating a controller this way does actually work.

Felix
  • 5,804
  • 4
  • 25
  • 37
  • 1
    I think a lot of that code should be in a directive but what if you use a two pass system. First just insert the script part into the page (which doesn't even need to be compiled) and then insert the compiled part – JoseM Apr 17 '14 at 13:51
  • That's a good idea! I tried it, but without success. See http://plnkr.co/edit/fzmEZlP6bGBJqTOkfApH?p=preview. Maybe it is to late in angular's lifecycle to add a controller? – Felix Apr 17 '14 at 14:52
  • 1
    Check this question, maybe that will help you get on the right track: http://stackoverflow.com/questions/15250644/angularjs-loading-a-controller-dynamically – JoseM Apr 17 '14 at 14:53

1 Answers1

1

I finally managed to do it based on the solution in Loading an AngularJS controller dynamically. Thx @JoseM, @MaximShoustin and @JussiKosunen for your hints and help.

http://plnkr.co/edit/fzmEZlP6bGBJqTOkfApH?p=preview

Community
  • 1
  • 1
Felix
  • 5,804
  • 4
  • 25
  • 37