在Aurelia应用程序中，未在MS Edge上应用SVG渐变

Question

我正在构建一个基于AureliaJS的应用程序，其中包含一个基于SVG的组件。我的问题是，在MS边缘，此SVG的梯度不会呈现（参见下图：在＆＃34;规＆＃34;应该是透明的，这两个圆绿色）。它在我测试的所有其他浏览器中正确显示（FireFox，IE11，Chrome）。

渐变是在defs部分的SVG中定义的。然后他们被他们的ID使用。

我试过了：

• 在Edge中将组件的SVG部分打开为SVG文件。奇怪的是，它正确呈现。所以我猜SVG是正确的。
• 删除Aurelia标记：问题仍然存在。
• 将填充值（当前fill: url(#gauge-fill-2)）更改为fill: url('#gauge-fill-2')或fill: url('/#gauge-fill-2')但未成功。

我也在控制台中收到以下消息，如果我删除了这个SVG就消失了（因为我有法语版的Windows 10，我将其翻译成法语版） XML5633: The name of the ending tag doesn't match the name of the starting tag. Line. 60, column 7 但是，当我阅读代码时，我无法找到关闭标签的任何问题。为了确保这一点，我删除了大部分代码，只留下一个带有渐变的元素。这条消息仍在那里。

此处提供了该组件的完整代码：https://bitbucket.org/arenaoftitans/arena-of-titans/src/9f5f70ff3fc71832bcac90ce0dcc5204a471b095/app/game/play/widgets/gauge/gauge.html?at=master&fileviewer=file-view-default

知道问题可能是什么以及如何解决它？

Answer 1

问题由创作者更新解决。我只需要广泛部署它。