ng-bind-html 元素不适用于音频标签

Posted 2023-03-05

【中文标题】ng-bind-html 元素不适用于音频标签

【英文标题】：ng-bind-html element not working with audio tag

【发布时间】：2014-09-19 11:37:02

【问题描述】：

我在 result.questionText 范围内有一个变量，它包含 <i>How many times are the hands of a clock </i>at right angle in a day?<audio controls ng-src="media/abc.mp3"></audio> ，我想显示 html 音频组件而不是那个音频标签，所以我在我的 html 页面中这样写，

<span class="row pull-left" ng-bind-html="result.questionText"></span>

但它在音频标签之前显示文本但不显示音频组件。 我试过放 img 标签，它工作正常。

有什么想法吗？

【参考方案1】：

看来您必须使用$sce.trustAsResourceUrl。以See this 为例。

【讨论】：

感谢评论...但是o / p没有变化.. :(

如果要查看角度源代码，它会在 ng-bind-html 指令中使用element.html($sce.getTrustedHtml(parsed(scope)) || '');。因此，您应该首先将音频内容（'media/abc.mp3'）的路径设置为受信任：$scope.audiosource = $sce.trustAsResourceUrl('media/abc.mp3'); 和<audio controls ng-src="audioSource">。

也是there is 通过Filter 设置$sce.trustAsResourceUrl 的一个很好的例子。我希望现在变得更清楚了。

得到了答案 $scope.result.questionText = $sce.trustAsHtml($scope.result.questionText); 适合我。