accordion with ng-repeat and ng-bind-html won't work

不羁的心 提交于 2020-01-02 16:55:06

问题


I'm trying to use accordion and html content in this way:

<accordion>
   <accordion-group ng-repeat="item in items">
      <accordion-heading>
          <a class="btn btn-primary btn-block btn-elenco">
         <img postsrc="img/flag/flag_{{item.index}}.jpg">
      </a>
      </accordion-heading>
      <p ng-bind-html="item.content"></p>
   </accordion-group>
</accordion>

AND

var items = [];
for(var i=0;i<10;i++){
var content = "<div>TEST</div>";
items.push({index:i,content:content});
}
$scope.items = items;

var app = angular.module('MyApp',['ngSanitize','ui.bootstrap']);

Accordion works but html isn't rendered into p tag.

What could be the problem?

EDIT

If i try something like:

<div ng-bind-html="to_trusted(item.content)"></div>

And add function to controller:

$scope.to_trusted = function(html_code)
    {
    console.log(html_code);
    return $sce.trustAsHtml(html_code);
    }

Nothing changes and in console i get many "undefined"!


回答1:


This is because the HTML content is declared unsafe by Angular due to it's Strict Contextual Escaping.

Another SO answer already explains clearly how this can be solved: HTML injection, that is if you are using Angular version 1.2.0 or up.

I created a Plunkr to match your case.



来源:https://stackoverflow.com/questions/21455814/accordion-with-ng-repeat-and-ng-bind-html-wont-work

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!