Angular 范围内的 SVG URL 在 Safari 中不起作用

Question

我正在尝试在我的 Angular 应用程序中动态设置 SVG 的 URL。

在我的控制器中我有：

$scope.svg = "http://url/of/svg.svg"

在我的 HTML 中我有：

<object type="image/svg+xml" data="{{svg}}" />

在 Chrome 和 Firefox 上，当我加载我的页面时，我首先收到 {scope} 的 404，然后我收到 http://url/of/svg.svg 的成功请求。图片显示正确。

但在 Safari 中，我只得到 {scope} 的 404，它从不尝试请求 SVG。没有显示图像。

我是否需要做一些特别的事情才能让 Safari 遵守 SVG 的范围更改？

Answer 1

我可以通过将 "data" 更改为 "ng-attr-data" 来解决此问题，这意味着浏览器尝试加载的第一个 URL 是正确的 URL.

<object type="image/svg+xml" ng-attr-data="{{svg}}" />

Angular SVG URL from scope does not work in Safari