如何在Angular 2中注入SVG圖像？

我收到我的後端SVG圖像，我需要它注入到一個容器：如何在Angular 2中注入SVG圖像？

<div class="svg-container" [innerHTML]="svgData"></div>

然而，這一切似乎<svg>元素被移除，我的容器保持爲空：

WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss).

我測試了一些簡單的東西，如<p></p>，它的工作。我應該怎麼做？

來源

2017-03-08 user2061057

從角2文檔摘自：

信任安全值

有時應用程序真正需要包括可執行代碼，顯示一個從一些URL，或構建潛在危險網址。爲了防止在任何這些情況下自動清理垃圾，你可以告訴Angular你檢查了一個值，檢查它是如何生成的，並確保它始終是安全的。不過要小心。如果您信任一個可能具有惡意的值，則會在您的應用程序中引入一個安全漏洞。如有疑問，請致電專業安全審查員。

爲了紀念價值爲可信，注入DomSanitizer並調用下列方法之一：

> bypassSecurityTrustHtml 
> bypassSecurityTrustScript 
> bypassSecurityTrustStyle 
> bypassSecurityTrustUrl 
> bypassSecurityTrustResourceUrl

請記住，一個值是否安全取決於上下文，因此選擇正確的上下文爲您的預期用途的價值。

簽出更多的位置： https://angular.io/docs/ts/latest/guide/security.html

來源

2017-03-08 15:54:11

你如何實際使用'bypassSecurityTrustHtml'？ – user2061057

好吧，我明白了。我需要'this.svgData = sanitizer.bypassSecurityTrustHtml（myReceivedData）;'它工作。謝謝！ – user2061057

如何在Angular 2中注入SVG圖像？

回答

相關問題