为什么IE 11不能将SVG样式与外部CSS一起使用？

Question

我在模板内绘制\(-?[0-9]\d*(\.\d+)?\) 路径。对于Chrome，Firefox和Edge来说看起来不错，但是IE 11不会显示我的路径。当我开始使用内联属性时，它对于IE 11可以正常工作，但是看起来并不优雅。我想保持代码简洁。

如果我使用以下模板和外部CSS，IE 11将不会显示我的SVG。

path

外部CSS：

<svg:g>
    <svg:path [ngClass]="path.pathType === solid 
            ? 'solid-path'
            : 'dotted-path'" 
            [attr.d]="pathValue">
    </svg:path>
</svg:g>

如果我将以下模板与内联属性一起使用，则一切正常。

.solid-path {
    stroke: blue;
    stroke-width: 2;
    fill: transparent;
}

.dotted-path {
    stroke: blue;
    stroke-dasharray: 3, 3;
    stroke-width: 2;
    fill: transparent;
}

如何使IE 11使用外部<svg:g> <svg:path stroke="blue" fill="transparent" [attr.d]="pathValue" [attr.stroke-dasharray]="path.pathType !== solid ? 3 : 0"> </svg:path> </svg:g> 中的样式而不是内联属性？提前致谢。