在 Angular 应用程序中嵌入 SVG 图像

Question

我正在开发一个 Angular 应用程序，并试图找出处理 SVG 的最佳方法：

1. 将它们用作背景图像、img 标签的 src 属性等。 - 我失去了使用 CSS 设置 SVG 样式的能力。另一方面，它非常易于使用，我不必复制/粘贴内容

2. 使用第 3 方应用程序为我们发出请求，并将 SVG 放入具有指令的容器中 - 例如https://www.npmjs.com/package/ng-inline-svg - 它会发出我想要的 HTTP 请求喜欢回避。不过，我可以使用 CSS 设置图像样式

3. 将 SVG 直接放入组件模板中 - 无需提出任何额外请求，并且我可以完全控制样式。但这会降低代码的可重用性。

我想完全避免 HTTP 请求的原因是因为我们有多个主题（相同的 SVG，但颜色不同），并且我希望每个“图像”最多加载一个资源。

有什么我可以使用的好的做法吗？有什么开源代码可以看一下吗？

第三种选择还好吗？也许我可以编写一个 Angular 服务并以某种方式对内联 SVG 进行分组，但我现在没有任何想法。

亲切的问候，马尔辛