如何在 <div> 中显示 HTML使用 Angular 1.2.0 - rc2 [英] How can I display HTML in a <div> with Angular 1.2.0 - rc2

查看:23
本文介绍了如何在 <div> 中显示 HTML使用 Angular 1.2.0 - rc2的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在我的网页中显示一些 HTML 并使用以下内容:

 xx {{ pageHtml }} yy<div data-ng-bind-html-unsafe="$scope.pageHtml"></div>

xx 和 yy 之间的数据显示为原始 HTML,但我想要的是不将其显示为原始 HTML.我在第二行使用了代码,但没有显示.

有什么我遗漏的吗?1.2 中是否发生了一些变化,因为我之前认为这可以正常工作?

更新 - 我 100% 信任 HTML 并且不想清理它.HTML 中的代码需要显示在屏幕上.

解决方案

默认情况下,使用 $sanitize 服务对由 innerHTML 编辑的表达式结果进行清理,该服务需要您包含 ngSanitize 在您模块的依赖项中.

但是,如果您相信 HTML 是安全的,则可以使用将注入控制器的 $sce 服务绕过清理:

$scope.someSafeContent = $sce.trustAsHtml("<i>Hello</i> <b>World!</b>");

HTML:

<div data-ng-bind-html="someSafeContent"></div>

I am trying to display some HTML in my web page and using the following:

        xx {{ pageHtml }} yy 

        <div data-ng-bind-html-unsafe="$scope.pageHtml"></div>

The data between xx and yy shows up as raw HTML but what I want is to not show it as raw. I used the code on the second line but nothing shows.

Is there something I am missing? Did something change in 1.2 because I thought this was working before?

Update - I do 100% trust the HTML and don't want to clean it. There will be code inside the HTML that needs to show on the screen.

解决方案

By default the innerHTML-ed expression result is sanitized using the $sanitize service which would require you to include ngSanitize in your module's dependencies.

<div data-ng-bind-html="pageHtml"></div>

However if you trust the HTML to be safe, you can bypass sanitization using $sce service that you would inject in your controller:

$scope.someSafeContent = $sce.trustAsHtml("<i>Hello</i> <b>World!</b>");

HTML:

<!-- bypasses sanitizaton -->
<div data-ng-bind-html="someSafeContent"></div>

这篇关于如何在 &lt;div&gt; 中显示 HTML使用 Angular 1.2.0 - rc2的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆