双向数据绑定时如何在页面输出渲染后的Html标签而不是源码

angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签中的注入攻击,但有些时候还是需要的,特别是从数据库读取带格式的文本时,无法正常的显示在页面中。
而要对html进行转义,则要在数据绑定的html标签中使用ng-bind-html属性。
页面:

 <div id="details" style="display:none">
        <h2 class="text-center">{{Detailsnews.Title}}</h2>
        <p ng-bind-html="Detailsnews.Content | trustHtml"></p>
</div>

Angular:

    app.filter('trustHtml', function ($sce) {
        return function (input) {
            return $sce.trustAsHtml(input);
        }})

原文链接

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,310评论 1 41
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,854评论 18 139
  • ng-model 指令ng-model 指令 绑定 HTML 元素 到应用程序数据。ng-model 指令也可以:...
    壬万er阅读 889评论 0 2
  • AngularJS AngularJS概述 介绍 简称:ng Angular是一个MVC框架 其他前端框架: Vu...
    我爱开发阅读 2,347评论 0 8
  • 小肠者,受盛之腑也,与心为表里,手太阳是其经也。心与[一本无此二字]小肠绝者,六日死。经则发直如麻,汗出不已,不得...
    天一书社阅读 668评论 0 0