Angular Material SVG 图标出现 404 错误

Question

我在与 app.component 相同的目录中有一个 SVG 文件。我按照 Angular Material 示例在 html:

中使用图标

<md-icon svgIcon="thumbs-up"></md-icon>

打字稿：

import {Component} from '@angular/core';
import {DomSanitizer} from '@angular/platform-browser';
import {MdIconRegistry} from '@angular/material';

@Component({
   selector: 'icon-svg-example',
   templateUrl: './icon-svg-example.html',})

export class IconSvgExample {
  constructor(iconRegistry: MdIconRegistry, sanitizer: DomSanitizer) {
    iconRegistry.addSvgIcon(
       'thumbs-up',
       sanitizer.bypassSecurityTrustResourceUrl('assets/img/examples/thumbup-icon.svg'));

我在开发服务器运行时没有显示图标？我刚刚在控制台中收到此错误消息：

GET http://localhost:4200/thumbs-up.svg 404 (Not Found)
Error retrieving icon: undefined

Answer 1

由于您无法通过评论将其标记为已解决：

尝试将其放入您的 assets/img/examples 文件夹，因为这是您提供的路径

Angular Material SVG 图标出现 404 错误

Angular Material SVG icon giving 404 error

angular-material2

angular