我要在登录页面上看到的所有图标都从sprite.svg文件加载，该文件只需要请求一次。

我有一个带有svg精灵图标路径的数组（“ assets / icons / sprite.svg＃alien”，“ ...”等），我尝试使用ngFor循环显示它们。

所以，我的问题是：当组件中的数组更新时，它会触发* ngFor循环并绘制一个svg图像，但是每次它请求sprite.svg文件时。

是否存在使用ngFor这种方法并仅请求sprite.svg 1次（在第一次请求图标时）的解决方案？

为什么每次ngFor触发时都要求sprite.svg？

我尝试过的事情：

<button (click)="change()">Click</button>
<ul>
  <li *ngFor="let ic of icons">
    //option 1
    <svg-icon-sprite [src]="ic" [width]="'20px'" class="test"></svg-icon-sprite>

    //option 2
    <svg>
      <use xlink:href="ic"></use>
    </svg>
  </li>
</ul>

功能

  change()
  {
    this.icons.push("assets/icons/sprite.svg#003-Asteroid");
  }