问题标签 [ng-bind-html]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2178 浏览

javascript - Angular:将 transclude 与 ng-bind-html 一起使用

我有以下角度设置:

它通过控制器中的 ajax 提取原始 html 标记并将其存储在@scope.html. 在指令中,这个 html 通过ng-bind-html.

html(玉)看起来如下:

它基本上有效。但是在包含的这个 html 中,我有一些半透明的内容,就像{{searchType}}我想要解决的那样。不幸的是,事实并非如此,它在浏览器中显示“{{searchType}}”。我可以改变什么来使嵌入工作?

我阅读了$compileand $transclude,但我不知道如何使用它或者它是否可以帮助我解决我的问题。谢谢!

0 投票
1 回答
2022 浏览

javascript - ng-bind-html 添加了自己的 css 类“ng-binding”,它破坏了所有嵌套的 css,如何摆脱它?

我想添加一些 html 以从$scope变量中查看。我想将它添加到 angular-ui 导航栏中。当我在浏览器中检查时生成的代码绝对正确,但似乎额外的 css 样式破坏了一切。

我的 html 看起来像:

app.js 如下:

呈现的页面看起来像预期的那样,但下拉菜单不起作用。当我从浏览器复制不工作的 html 并手动打印它ng-bind-html并删除ng-binding样式时,一切正常

如何强制 ng-bind-html 只添加 html 而不添加一些额外的 css?另一种方法是创建自己的指令,如此处回答,但复制的代码不起作用。问题的作者可能没有显示所有内容,因此我没有包含一些重要的模块,错过了分号,做出了不正确的控制器指令声明顺序(?)等

谁能告诉我,如何使用 ng-bind-html 而不使用烦人的额外 css 或提供正确的自己的指令示例?

0 投票
2 回答
475 浏览

javascript - 结合 ng-repeat 和 ng-bind-html?

我有一个消息列表,其中的文本包含一些我想要显示的 html。因此,正如这里这里所建议的,我目前正在尝试的是:

它显示message.sender_name,但不显示message.text。当我简单地这样做{{ message.text }}时,它会正确显示文本(但显示 raw<br>而不渲染它们)。

有谁知道为什么这不起作用?

0 投票
1 回答
2117 浏览

javascript - 在 ng-bind-html 中渲染 Angular 代码

我正在尝试使用显着和角度来渲染 github 自述文件。与解析降价相关的一切工作正常,但不幸的是,产品所有者对应用程序有更多的希望。

他希望能够将 youtube 视频和 html 表单放入自述文件中。我目前正在使用Brandly制作的Youtube-embed 指令,但不幸的是它没有呈现在我们的页面中。

我正在使用一个脚本,它ng-bind-html结合使用$sce.trustAsHtml来解析页面中的 html。正常的 HTML 可以很好地拾取(表单标签和其他东西),但有角度的东西(例如 youtube 指令)不是。

我还注意到诸如ng-click,ng-submit等的角度指令不起作用。有谁知道如何在 html 中使用 angular 应用程序解析 angular 工作ng-bind-html

这是一个关于如何将 html 解析为模板的代码示例:

JS:

HTML:

我已经添加了一个Plunker 示例来解决我遇到的问题,正如您所看到的,它永远不会执行ng-submit我在表单中添加的内容。

~ Archcry

0 投票
0 回答
38 浏览

angularjs - 编译包含自定义属性并从 $http 服务返回的内容

我正在开发一个严重依赖客户端并通过 RESTful API 呈现应用程序的大部分组件的 Angular 应用程序。其中之一是存储在 JSON 文件中的导航组件,它由使用 ui-router 语法在状态之间导航的链接列表组成。

到目前为止,我已经设法编写了一个从 json 构建导航的服务。然后,使用控制器,我使用 Angular 的 sanitize 服务将其渲染到视图中。我坚持的部分是,结果链接显示为不可点击的硬编码字符串。

从我阅读的不同线程中,我认为这是因为它们没有被编译而只是被扔到视图中,但我无法让它们编译/工作。我见过类似的线程,例如此处此处,但它们都依赖于为其创建自定义指令。我需要渲染和编译从 $http 服务返回的动态 html(具体为 ui-sref 链接)。

JSFiddle

0 投票
2 回答
3876 浏览

angularjs - 链接在 ng-bind-html 中不起作用

我正在使用 ng-bind-html,但绑定 html 中的链接不起作用。

这是绑定内容的代码:

这就是链接的编译方式 编译链接

to_trusted 过滤器如下所示:

而且,当我点击链接时,什么也没有发生。控制台中也没有任何内容。

想法?

编辑:输入字符串:

Edit2:我应该说,如果我右键单击该链接然后单击“在新选项卡中打开”,则该链接可以正常工作

0 投票
1 回答
277 浏览

html - 插入 HTML 代码 AngularJS

我正在尝试使用变量$scope.text插入此 html 代码:

在 Angularjs 的 html 文件中,我使用:<div ng-bind-html="text"></div>

问题是,在我的 Web Inspector 中只有:

如何显示所有参数?

0 投票
0 回答
582 浏览

angularjs - 带有html字符实体的angularjs ng-bind-html

ng-bind-html="text1"工作正常。结果是sometextng-bind-html="text2"不起作用。结果是 <b>sometext<b>

我怎样才能ng-bind-html="text2"工作。谢谢你。

0 投票
2 回答
29789 浏览

angularjs - 为什么 ng-bind-html 不显示任何内容?

我正在显示一个包含 HTML 代码的字符串:

<div style="font-size: 14px" ng-bind="currentBook.description"></div>

put 它显示 HTML 代码而不是解释元素:

在此处输入图像描述

当我使用ng-bindandng-bind-unsafe时,它什么也没显示。

如何获取要解析的 HTML?

附录

我添加了对 sanitize 的引用,但ng-bind仍然ng-bind-unsafe没有显示:

好的,我添加了 ngSanitize var app = angular.module('app', ['ngSanitize']);,现在它可以工作了。

0 投票
1 回答
4909 浏览

javascript - 在 AngularJS 中从可信来源插入 iframe

尝试使用ng-bind-htmlAngularJS 将 iframe 插入页面,但即使是最简单的形式,我也无法让它工作。

Javascript

我的 HTML: