问题标签 [ng-bind-html]

我面临的问题是我从具有 HTML 内容的服务器获取数据

<p> hello <a class='mention'data-id='1'>Amerr</a></p>

由于ng-bind-html Santaize它将删除所有潜在威胁以及data-id='1'等属性。我的指令需要它。所以我用

1. $compile让我的指令作用于锚标签。
2. $sce.trustAsHtml 返回编译后的代码。

所以如果有任何文字

$compile(html_code)($scope)

这将执行代码并导致角度执行表达式导致问题。帮助我如何解决这个问题。

我正在尝试让 ng-click 指令在 ng-repeat 和 ng-bind-html 中运行。ng-click 代码被添加到从服务器提取的数据中的 html 字符串中（因此是 ng-bind-html）。该设置有一个控制器、一个使用 Drupal 放在页面上的基本模板，以及一个通过 Drupal 的模板加载的部分模板。

控制器现在看起来像这样：

正如您在 ViewService.get() 调用中看到的那样，数据被获取然后处理。该处理只涉及在“Intro”字段的末尾放置一个链接，该链接旨在可点击。

有一段时间，我什至很难让 ng-click 指令显示出来（它被过滤掉了，没有 $sce.trustAsHtml）。现在它在那里，但点击它没有效果。

主模板（来自 Drupal）目前看起来像：

放置在上面 Drupal 模板中的 ng-click 按预期工作。

对于 ng-repeat 中使用的部分，它看起来像这样：

到目前为止，我一直在努力让 ng-click 在 short_intro 上工作，到目前为止还没有成功。任何关于我做错了什么的想法将不胜感激！

我正在使用 TinyMCE 对用户保存到数据库的内容进行样式设置，用户可以保存的示例如下：

我目前正在使用ng-bind-html在我的视图中显示此 HTML 内容，但是，它似乎正在剥离内联样式。这是我的浏览器来源：

有没有办法可以将这些内联样式保留在视图中？

我想在一个标签中同时呈现模板文件（视图 + 控制器）和多个 html 字符串。- 所以我有一些字符串，比如

和 html 文件 + 控制器之类的

我想将字符串和 template.html 渲染到一个标签中。

我已经连接了 html 字符串，并且可以使用

我可以序列化 html 文件并在 ng-bind-html 中呈现它吗？这些文件有自己的控制器：

他们会失去功能吗？

注意：元素的顺序很重要！！！例如，我想渲染字符串，然后是文件的内容，然后再渲染一个字符串。

非常感谢！

为此，我将头撞到墙上：

我想从控制器中设置动态生成的视图变量的值 在我的视图模板中：

在我的控制器中：

功能 ：

说明：我想在单个 div 元素中插入一个 iFrame。

任何人都知道如何做到这一点？

我正在尝试构建此处的菜单：

http://jsfiddle.net/1vgcs4we/

但是，当我将它实施到我的项目中时，我收到以下错误消息：

我得到的结果是我可以看到菜单项名称，但是当我将鼠标悬停在它们上面时，我收到一个空的菜单框？

这是我的 2 个带有 HTML 的指令：

我有一个用于在页面上呈现博客文章的数据源。其中一个条目包含一个 IFRAME。我看到 IFRAME 在数据源中返回，但它从未呈现到 ng-bind-html 中的页面。

这是我的代码：

如果我将其切换到以下内容，我会看到 IFRAME 标记呈现出来，但现在它当然是 RAW HTML。

我怎样才能让这个 IFRAME 呈现到页面上。

最好的事情是从头开始.. 所以：在我正在处理的项目（AngularJS）中，我使用 CKEditor 作为所见即所得的编辑器。在我想添加代码片段功能之前，一切都运行良好。

CKE 生成纯 html 代码，我可以将其绑定到模型以实时查看正在发生的事情。在我这边，我一直在使用 ng-bind-html 来查看结果，并且效果很好。每个基本 html 代码都可以正常工作，粗体、斜体、标题……字体、大小等。

当 CodeSnippet 插件（http://ckeditor.com/addon/codesnippet）进入......它停止工作（我的意思是codesnippet部分）。不工作的 HTML 示例（顺便说一句，CKE 使用 ‚&lt 和 > 生成代码，而不是普通的标签 < 和 >.. 所以我必须替换它们……但没关系，这不是问题 :) ）。片段示例（在 ng-bind 端不起作用）：

问题是编辑器内部一切正常，但外部（当绑定到 ng-bind-html 指令时），它不是。

到目前为止我尝试过的：
- 我包含了 CKE 编辑器在内部使用的 CSS 文件......毫无价值。- 代码片段插件使用highlight.js，所以我尝试将CKE html代码转换为highlight.js ..它工作！例子：

但问题是 CKE 编辑器会产生复杂的文本（包括代码片段、其他内容、引号等）。因此，如果我将所有这些都放入 HLJS 指令中……它会突出显示所有内容。这不是我想要达到的。

我对这个问题的解决方案是使用 HLJS + 普通 html 代码添加动态指令。结果示例：（hljs 指令它的角度指令 hightlight.js）：

为了让它工作，我必须重新编译我添加的整个代码。所以我把它放入指令中，一旦更新就可以观察和重新编译代码。

而且..它奏效了！！但是……真正的问题来了：

*它只适用于 HTML 有效的代码片段，因为 $compile 以某种方式验证了里面的所有这些东西……发生了什么？'<' 标签转换为 '<' ...如果我打开一些 HTML 标签.. 它会立即关闭它..（如果我“忘记”了它）和许多其他奇怪和不可接受的东西。

你有什么主意吗？我试图尽可能清楚地解释这个问题，但如果你有任何进一步的问题..

要在模板中呈现带有连字符的属性名称的表达式，必须使用方括号而不是点。示例 docs["paragraph-content"] 而不是 docs.paragraph-content。我正在尝试在指令模板中的 ng-bind-html-unsafe 中打印此变量，例如 ng-bind-html-unsafe="doc["paragraph-content"]" 但出现语法错误，错误：语法错误: 标记“未定义”不是从 [doc[] 开始的表达式 [doc[] 的 NaN 列的主表达式。

我有应该由ng-bind-html指令输出的html 内容，之后我想对这些内容进行一些操作（例如 DOM 操作、jQuery 插件等）。

stackoverflow 为我提供了这样的解决方案：

所以要创建具有更高优先级的自定义指令并在里面观察：

和演示

但就我不打算更改此内容而言，我不想使用$watch。没有$watch 可以吗？