src 在使用 angular.js 和 angular-sanitize.js 时从 json html 数据中剥离

Question

我在这里是个有棱有角的菜鸟……但很喜欢弄清楚。我有一个包含如下文本的简单 json 文件：

   "gettingstarted":{
      "title":"Getting Started",
      "content":"<img ng-src='images/pageone-snorkeler.png' width='150' height='107' alt='Snorkeler' /><p>Getting Started...... and a lot of other html in here...</p>"
   },"etc..."

我正在尝试将图像加载到呈现的 html 中，但是，angular 似乎正在从我的 html 中剥离 src 和 ng-src。

我的 page.tpl.html 文件如下所示：

<h1 ng-bind-html="page.title"></h1>
<div ng-bind-html="page.content"></div>

我正在加载/使用：

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular-route.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular-sanitize.min.js"></script>

我可以从 json 数据正确地看到页面中的所有 html 呈现，但是，不是图像。它是这样渲染的：

<img width='150' height='107' alt='Snorkeler' />

为了让图片加载到我的 html 中，我缺少什么？

编辑:::: 看起来我需要用不同的措辞来表达我的问题......我在这里找到了答案：ng-bind-html does not load image src

ng-bind-html-unsafe

...这对我不起作用...或使用完全解析的 url：例如 http://superraddomainname.com/image/image.png。

Answer 1

ng-bind-html-unsafe 已在 Angular 1.2 中删除。你对ng-bind-html 所做的应该可以工作，你必须确保在你的应用程序中添加ngSanitize 作为依赖项。比如……

angular.module('myApp', ['ngSanitize']);

Demo - Fiddle