Safari IOS剪辑路径不起作用

Question

我在Angular 5中创建一个Web应用程序，它也可以在移动设备上正常运行。它的进度条是一个svg图像，在Adobe Illustrator中创建并导出到svg。我已经在Android，Mac和Windows（所有浏览器）上都能正常工作，但我在Chrome或在iPhone IOS上运行的Safari浏览器上呈现剪辑路径时出现问题。

我试过正常

管理它

clip-path: url(#clip-path);

以及特定于webkit：

-webkit-clip-path: url(#clip-path);

但是这样的东西是这样的：

图片预览：

我在IOS上的Safari或Chrome上得到了这个：

错误的图片预览：

所以看起来裁剪完全被忽略了，但奇怪的是在Mac上工作正常。

请建议如何解决它，因为我几天都在努力解决它。

我还在

上创建了demo

Stackblitz