angular 弹出窗口 html

Question

popver-html 指令的正确使用方法是什么？ 我想通过 HTML img 标签将图像显示到我的弹出框 angular-bootstrap 中。 我创建了一个范围变量 $scope.html = "<img src=\""+$scope.mysrc+"\"></img>" 并将其放入我的指令中

<span popover-html="{{html}}" popover-title="......." popover-trigger="mouseenter"><a href="#">{{title}}</a></span>

但我有这个错误：

Uncaught Error: [$parse:syntax] ERROR popover-html

有什么建议吗？

Answer 1

这里有一个 plunk 指导您如何将图像放入弹出窗口中。寻找“Dynamic Popover”按钮 首先，您需要 sanitize 您在 JS 中写入的 HTML。

所以，你的 JS 是这样的：

$scope.html = $sce.trustAsHtml("<img src=\""+$scope.mysrc+"\"></img>");

这将确保您的 HTML 可以安全地解析为 HTML。不要忘记在您的应用程序中注入 ngSanitize 作为依赖项。

现在，在你看来，不用 popover-html="{{html}}" ，你需要使用 popover-html="html"。请注意，您正在将表达式传递给此弹出窗口。