Попытка создать пользовательский SVG mat-icon
, загружающий SVG напрямую из Github.Сначала я попробовал это с использованием DomSanitizer
и , документировавших результат в этой статье .Таким образом, SVG действительно загружается через HttpClient
.
Теперь я пытаюсь сделать это напрямую через DomSanitizer
, например:
constructor (private matIconRegistry: MatIconRegistry,
private domSanitizer: DomSanitizer) {
this.matIconRegistry.addSvgIcon(
"logo",
this.domSanitizer.bypassSecurityTrustResourceUrl("https://raw.githubusercontent.com/fireflysemantics/logo/master/l1.svg"));
}
И провожу тест рендеринга в app.component.html
:
<mat-icon>logo</mat-icon>
И SVG не появляется.Я предполагаю, что строка:
this.domSanitizer.bypassSecurityTrustResourceUrl("https://raw.githubusercontent.com/fireflysemantics/logo/master/l1.svg"));
должна загрузить svg, но я не вижу запроса на вкладке сети.Также, если мы просто вставим необработанный URL-адрес в адресную строку браузера:
https://raw.githubusercontent.com/fireflysemantics/logo/master/l1.svg
Запрос отображается на вкладке сети как l1.svg
.
Мысли?
Stackblitz
Обновление
Вышеприведенный Stackblitz включает в себя исправление из ответа, так что он работает сейчас!