将文件中的HTML模板加载到AngularJs中的variables中

我正在处理需要将HTML绑定到富文本编辑器的表单。 存储这个HTML内容的最好方法是一个HTML文件。

我不能完全弄清楚如何从文件加载HTML模板并将其分配给一个variables。

当使用templateUrl时，指令似乎能够做到这一点。 想知道这是否有任何低级别的angular度来实现一个控制器内的相同的东西

Answer 1

所有的模板都被加载到caching中。 有一个可注入的$ templateCache服务可以用来访问模板：

app.controller('testCtrl', function($scope, $templateCache){ var template = $templateCache.get('nameOfTemplate.html'); }); 

Answer 2

使用$templateRequest ，您可以通过它的URL加载模板，而无需将其embedded到HTML页面中。 如果模板已经加载，它将从caching中取出。

 app.controller('testCtrl', function($scope, $templateRequest, $sce, $compile){ // Make sure that no bad URLs are fetched. You can omit this if your template URL is // not dynamic. var templateUrl = $sce.getTrustedResourceUrl('nameOfTemplate.html'); $templateRequest(templateUrl).then(function(template) { // template is the HTML template as a string // Let's put it into an HTML element and parse any directives and expressions // in the code. (Note: This is just an example, modifying the DOM from within // a controller is considered bad style.) $compile($("#my-element").html(template).contents())($scope); }, function() { // An error has occurred }); }); 

请注意，这是手动完成的方法，而在大多数情况下，最好的方法是定义一个使用templateUrl属性获取模板的指令 。