如何在 Angular 2 中向内联 svg 添加样式

How to add style to inline svg in Angular 2 

 <div class="svg_ahu card_content" align="start" [inlineSVG]="'/assets/ahu.svg'"></div>

我使用此语法在 angular2 中包含 SVG，但无法设置样式。

CSS:

 #fill1 {
  animation: fill1 .1s ease infinite;
}

试试这样使用 

<div class="svg_ahu card_content" align="start" [attr.inlineSVG]="'/assets/ahu.svg'"></div>

`

这是由于样式封装而发生的。

您可以使用 3 个选项之一：

  • "encapsulation: ViewEncapsulation.None" 用于带有 SVG 的组件。
  • “/deep/#fill1”选择器，指定规则应用于子组件
  • 您可以将 SVG 样式移动到全局样式。[s]css 文件。