Bind html to angle-ui-bootstrap accordion

Question

Я использую аккордеон с угловым ui-bootstrap. И я нахожусь в ng-repeat. В моем заголовке аккордеона я пытаюсь связать с переменной области с html в ней. Я пытаюсь связать html с data-ng-bind-html и угловым сервисом $sce. Я также ввел ngSanitize в мое приложение.

Но я не получаю результат, который я хочу. Это мой аккордеон заголовок:

<accordion close-others="true"> 
     <accordion-group class="row" data-ng-repeat="content in pageContent" data-ng-if="content.pageId === page.id"> 
      <accordion-heading data-ng-bind-html="trustedHtml(content.columnTitle)" ></accordion-heading> 
      <!-- rest of content --> 
     </accordion-group> 
     </accordion> 

В мой контроллер я впрыснуть $sce и это $scope метод:

$scope.trustedHtml = function (input) { 

     return $sce.trustAsHtml(input); 
    } 

Может кто-нибудь помочь мне с этим?

Answer 1

Попробуйте сделать следующее,

В HTML

<accordion close-others="true"> 
    <accordion-group class="row" data-ng-repeat="content in pageContent" data-ng-if="content.pageId === page.id"> 
    <accordion-heading ng-bind-html="content.columnTitle | unsafe" ></accordion-heading> 
      <!-- rest of content --> 
    </accordion-group> 
</accordion> 

В JavaScript

app.filter('unsafe', function($sce) { 
    return function(val) { 
     return $sce.trustAsHtml(val); 
    }; 
}); 

Answer 2

Вместо этого с контроллером и моделью, почему бы не использовать шаблон директивы. Передайте переменную в шаблон. Извлеките его значение, а затем дайте ему значение замены внутри вашей директивы.