Angular 8无法更改内联SVG的填充颜色

Question

我在填充 InlineSVG 时遇到了一些问题。我有一个带有 svg 的div：

<div class="svg-div" [inlineSVG]="'../../../assets/images/add.svg'"></div>

然后在 CSS 中：

.svg-div {
    fill: blue;
}

但图标仍然是灰色的。

我也试过了：

.svg-div ::ng-deep svg{
    fill: blue;
}

不同的组合，但没有任何效果。
Here is the link to my stackblitz。怎么了？

Answer 1

你需要添加css路径

::ng-deep svg path {
  fill: blue;
}

Answer 2

它不起作用，因为填充属性是硬编码在您的 svg 文件中的。从您的 svg 文件中删除 fill="#7A7A7A" 然后您将能够通过 css 更改颜色。