带有html内容的angular.js ng-repeat li项目

发布于 2021-02-01 10:12:26

我有一个从服务器返回的模型,
当我使用ng-
repeat建立一个列表时,它包含html而不是文本(例如ab标签或i标签),它显示html为纯文本,是否有一个内置的过滤器或指令是否将html放入li项目中?
我查看了文档,但是由于我仍然很陌生,因此很难找到它。

ng-repeat:

    <li ng-repeat="opt in opts">

JSFiddle:

http://jsfiddle.net/gFFBa/1/

关注者
0
被浏览
80
1 个回答
  • 面试哥
    面试哥 2021-02-01
    为面试而生,有面试问题,就找面试哥。

    它像ng-bind-html-unsafe="opt.text"

    <div ng-app ng-controller="MyCtrl">
        <ul>
        <li ng-repeat=" opt in opts" ng-bind-html-unsafe="opt.text" >
            {{ opt.text }}
        </li>
        </ul>
    
        <p>{{opt}}</p>
    </div>
    

    http://jsfiddle.net/gFFBa/3/

    或者,您可以在范围内定义一个函数:

     $scope.getContent = function(obj){
         return obj.value + " " + obj.text;
     }
    

    并以这种方式使用它:

    <li ng-repeat=" opt in opts" ng-bind-html-unsafe="getContent(opt)" >
         {{ opt.value }}
    </li>
    

    http://jsfiddle.net/gFFBa/4/



知识点
面圈网VIP题库

面圈网VIP题库全新上线,海量真题题库资源。 90大类考试,超10万份考试真题开放下载啦

去下载看看