在 ng-repeat 的 img 标签中的 data-original 属性中转义 link

Question

我在控制台中看到我的浏览器正在向一个不存在的 link 发出请求，因为我已将它放在图像的原始数据中。但这是一个畸形的URL。示例如下：

http://localhost:8080/%7B%7Bobject.array[0].url%7D%7D

我在 ng-repeat 中有一个 <img src="" /> 标签。我希望我的数据原始属性被 url 编码，并防止 javascript 在

处进行此类调用

{{object.array[0].url}}

给出。

示例代码如下：

<div ng-repeat="object in objects">
    <img src="constant.jpg" data-original="{{object.array[0].url}}" />
</div>

我不能在这里使用 ng-src，因为 src 属性中给定的图像 link 在这里是常量。

Answer 1

尝试使用 ngAttr 指令来绑定您的属性

<img src="constant.jpg" ng-attr-data-original="{{object.array[0].url}}" />

这可以防止任何人在绑定发生之前看到属性值

要转义 url，您需要 this 答案中的内容。

Escape link in data-original attribute in img tag of ng-repeat