Angular：綁定到xlink：href不會更新IE11中的SVG

Question

我有一個顯示SVG的Angular 4應用程序。 SVG是動態的，取決於模型。這是通過伺機到use xlink:href屬性來實現的：

<svg class="svg-icon"> 
    <use [attr.xlink:href]="'./symbol-defs.svg#' + icon" /> 
</svg> 

注意icon是可變的，並且因此可以改變。發生這種情況時，應該更新SVG以反映這一點。

在Chrome，Firefox，Safari和Edge中一切正常，但在IE中，模型更改時不會更新SVG。這是一個Plunker說明問題。它適用於除IE（11）以外的所有瀏覽器。有關如何解決這個問題的任何想法？

Answer 1

您可以使用svg4everybody模塊。 https://github.com/jonathantneal/svg4everybody

只是npm i --save svg4verybody

而且在未來AppModule.ts例如，你需要添加

import * as svg4verybody from 'svg4everybody/dist/svg4everybody'; 
... 

ngOnInit() {svg4verybody();}