Загрузите HTML-шаблон из файла в переменную в AngularJs
Я работаю с формой, которая должна привязывать HTML к Rich Text Editor. Лучший способ сохранить этот HTML-контент - это HTML файл.
Я не могу понять, как загрузить шаблон HTML из файла и назначить его переменной.
Директивы, похоже, могут это сделать при работе с templateUrl. Интересно, есть ли у него какой-либо низкоуровневый api в angular для достижения того же самого внутри контроллера.
Ответы
Ответ 1
Все шаблоны загружаются в кеш. Существует инъекционная $templateCache служба, которую вы можете использовать для доступа к шаблонам:
app.controller('testCtrl', function($scope, $templateCache){
var template = $templateCache.get('nameOfTemplate.html');
});
Ответ 2
Используя $templateRequest
, вы можете загрузить шаблон по URL-адресу без необходимости встраивать его в свою HTML-страницу. Если шаблон уже загружен, он будет выведен из кеша.
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 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
});
});
Помните, что это ручной способ сделать это, и в большинстве случаев предпочтительным способом будет define a directive, который извлекает шаблон с использованием свойства templateUrl
.