使用带有自定义指令的 ng-bind-html答案

【问题标题】：Using ng-bind-html with a custom directive使用带有自定义指令的 ng-bind-html
【发布时间】：2016-01-30 00:32:19
【问题描述】：

我需要将几个自定义指令之一动态加载到视图中，并且遇到了ng-bind-html 指令

我可以传入我的指令的字符串表示形式，因为它将在标记中使用吗？

例如，在我拥有的控制器中说

vm.dir= '<my-directive data="someData" click-handler="vm.aClickHandler"></my-directive>';

我希望能够让它看起来像这样

这对我不起作用，我在 DOM 中看不到指令标记，只有具有 ng-bind-html 属性的 div。

如果我使用像 <b>Hi!</b> 这样的简单 HTML 字符串，那么在我看来这会很好地呈现。

我希望能够根据控制器中的逻辑将指令标记动态添加到我的视图标记中，ng-bind-html 会在这里帮助我吗？

【问题讨论】：

"将 ng-bind-html 在这里帮助我" ...不，它不编译指令。什么是用例？听起来您并没有像应该做的那样构建模型视图关系

标签： angularjs

【解决方案1】：

ng-bind-template 可以为所欲为。

ngBindTemplate 指令指定元素文本内容应替换为 ngBindTemplate 属性中模板的插值。与 ngBind 不同，ngBindTemplate 可以包含多个 {{ }} 表达式。由于某些 HTML 元素（例如 TITLE 和 OPTION）不能包含 SPAN 元素，因此需要该指令。

您也可以只使用 ng-include 指向部分文件或 script tag 的内容。

Here 是您可以实现此目的的另一种方式。

【讨论】：