angular7 - Angular 7 中的多个 mat-icon 注册表

Question

当我尝试多个图标时，我在 <mat-icon> 中给出的第一个图标标签对所有 mat-icon 标签重复。

constructor(private matIconRegistry: MatIconRegistry, private domSanitizer: DomSanitizer) {
 
     this.matIconRegistry.addSvgIcon('downld', this.domSanitizer.bypassSecurityTrustResourceUrl('./assets/images/DownloadCloud.svg'));
     this.matIconRegistry.addSvgIcon('match', this.domSanitizer.bypassSecurityTrustResourceUrl('./assets/images/Match.svg'));
     this.matIconRegistry.addSvgIcon('openfile', this.domSanitizer.bypassSecurityTrustResourceUrl('./assets/images/OpenFile.svg'));
  }

<mat-icon svgIcon="match"></mat-icon>
<mat-icon svgIcon="openfile"></mat-icon>
<mat-icon svgIcon="downld"></mat-icon>

Output

Answer 1

晚会有点晚了，但对于困惑的 future 读者来说:

问题不是将注册表用作流畅的 API，而是 SVG 本身。

问题是 SVG 使用了相同的 ID，因此覆盖了它们自己。解决方案在这里找到:https://github.com/angular/components/issues/14959#issuecomment-481797135