Блог

Я работаю с формой, которая должна привязывать HTML к редактору расширенного текста. Лучшим способом хранения этого HTML-содержимого будет HTML-файл.

Я не совсем понимаю, как загрузить HTML-шаблон из файла и присвоить его переменной.

Кажется, что директивы могут это делать при работе с templateUrl. Было интересно, есть ли какой-либо низкоуровневый API в angular для достижения того же самого внутри контроллера

Используя $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'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 свойства.

Все шаблоны загружаются в кэш. Для получения доступа к шаблонам вы можете использовать встроенную службу $templateCache:

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