1

Is there a way to include html templates in AngularJS modules without putting them as strings into js code into the templateCache?

paweloque
  • 18,466
  • 26
  • 80
  • 136

2 Answers2

2

The way we've accomplished this is to write our html templates as standalone html files, then use a grunt task to crunch them into strings (handles all the escaping etc) and inject them into the template cache. best of both worlds, as the developers can work on individual HTML files all under source control, but we drastically reduce roundtrips to the server to pull the templates down to the app at runtime. (At the cost of up-front loading)

Ben Heymink
  • 1,700
  • 12
  • 26
  • I saw this approach in the ui-bootstrap library. Was wondering whether there is a direct way without pulling into js – paweloque Oct 14 '14 at 09:39
  • Well, the 'direct' way is to reference your templates in your directives and let Angular make a request to your server to fetch them on demand as the directives are compiled, is that what you mean? So your directives would have a line that looks something like this: templateUrl: '/myDirectives/mytemplate.html' And it would simply request that file from the server. – Ben Heymink Oct 14 '14 at 09:47
1

If you want to include one html in another, you can use ng-include directive of angularjs.

I have used this like below:

<div ng-include src = "'partials/myModule/myHtml.html'"></div>
Vipul Agarwal
  • 1,513
  • 3
  • 14
  • 24
  • The problem here is that you don't know where the module will be installed...and thus don't know which directly to use for your ng-include. – Jordan Lapp Aug 17 '15 at 15:26