解决angularjs 使用 ng-repeat 循环输出时html元素无法解析的问题

最新推荐文章于 2022-02-20 16:29:46 发布

咸鱼(已沉底)

最新推荐文章于 2022-02-20 16:29:46 发布

阅读量4.1k

点赞数 1

本文链接：https://blog.csdn.net/SheeranX/article/details/77724517

版权

今天在做项目的时候遇到一个奇葩的问题，JSON 数据中存在html 标签，讲道理的话，使用ng-repeat 输出后浏览器会帮我们把标签给解析了，但是实际上并没有! why?

上网搜了一下类似问题，说是可以用ng-bind-html + $sce.trustAsHtml 解决。然而ng-bind-html 只能处理一组数据，我即想输出多组数据又想把HTML 解析问题给解决了，怎么办？

有些时候写代码需要经验，有些时候需要智慧，但我觉得很多时候考的是灵感，比如说，上面这个问题， ng-repeat + ng-bind-html 完美解决问题。

不多BB，直接上关键代码

html：

<div ng-repeat="x in dataset">
	<div ng-bind-html="convert(x)">
		<!-- This is the conent  -->
	</div>
</div>

js:

$scope.convert = function(n){
    return $sce.trustAsHtml(n);
 }

关键思路就是循环输出的时候调用convert方法，这样就能结局html 元素无法解析的问题了

关注