Динамический частичный AngularJS в $ templateCache удаляется

0

Либо мой код преследует, либо я допустил ошибку:

У меня есть json feed:

{
  "sections": [
    {
      "identifier": "header",
      "blocks": [
        {
          "identifier": "onebyone",
          "html": "<h1>API</h1>"
        },
        {
          "identifier": "onebyone",
          "html": "<h1>API</h1>"
        }
      ]
    },
    {
      "identifier": "content",
      "blocks": []
    },
    {
      "identifier": "footer",
      "blocks": []
    }
  ]
}

Я делаю вызов в моем контроллере AngularJS, и я сортирую разделы и пытаюсь выполнить html-блоки, так что:

cmsApp.controller('cmsPageCtrl', function($scope, $http, $templateCache, $sce) {

    $http.get("/api.php/api/page/home")
        .success(
            function(response) {
                $scope.sections = [];

                response.sections.forEach(function(el, idx, arr) {
                    var id = el.identifier;

                    $scope.sections[id] = el;
                    //$scope.sections[id].template = "<h1>HOI</h1>";
                    $scope.sections[id].template = 'header.html';

                    var template = "TEST";

                    el.blocks.forEach(function(el, idx, arr) {

                        var partial = el.html;
                        template = template + partial;
                    });

                    template = template + "<div><b>b</b>TEST1</div>";
                    console.log(id);
                    console.log(template);

                    $scope.sections[id].template = 'header.html';

                    $templateCache.put('header.html', $sce.trustAsHtml(template));
                    console.log(template);

                });
            }
        );
});

Теперь можно было бы ожидать, что следующий вывод этого:

<body ng-app="cmsApp" ng-controller="cmsPageCtrl">
    <ng-include src="sections.header.template"></ng-include>
</body>

To be: TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>

Результат: <span class="ng-scope">TEST</span><div class="ng-scope"><b>b</b>TEST1</div>

Консольный выход:

cms.ctrl.js (line 33)    TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>
cms.ctrl.js (line 34)    TEST<h1>API</h1><h1>API</h1><div><b>b</b>TEST1</div>
cms.ctrl.js (line 39)    content
cms.ctrl.js (line 33)    TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 34)    TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 39)    footer
cms.ctrl.js (line 33)    TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 34)    TEST<div><b>b</b>TEST1</div>
cms.ctrl.js (line 39)

Что отвечает за удаление HTML в выводе раздела заголовка?

1 ответ

1

Угловая делает это по умолчанию для защиты от инъекций. Если вы действительно хотите это сделать, вам нужно включить плагин ng-sanitize, а затем добавить модуль к вам:

angular.module('myApp', ['ngSanitize']);

а затем свяжите содержимое html с помощью директивы ng-bind-html.

ng-bind-html="myHTML"

Документация

  • 0
    При добавлении в GPicazo вы обновляете html-кэш во всех циклах, используя значения для одного и того же ключа. Это мнение, что ценность, которая сохраняется, является последней.
  • 0
    @ RaúlMartín - Не уверен, о чем ты говоришь. Ваш комментарий означал оригинальный вопрос?
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню