我正在开发一个 Angular 应用程序,并试图找出处理 SVG 的最佳方法:
将它们用作背景图像、img 标记的 src 属性等 - 我失去了使用 CSS 设置 SVG 样式的能力。另一方面,它很容易使用,我不必复制/粘贴内容
使用向我们发出请求的第 3 方应用程序并将 SVG 放入具有指令的容器中 - 例如https://www.npmjs.com/package/ng-inline-svg - 它发出我想要的 HTTP 请求喜欢避免。但是,我可以使用 CSS 设置图像样式
将 SVG 直接放在组件模板中 - 没有额外的请求,我可以完全控制样式。但这会降低代码的可重用性。
我想完全避免 HTTP 请求的原因是因为我们有多个主题(相同的 SVG 但不同的颜色),并且我希望每个“图像”最多加载一个资源。
有什么好的做法我可以使用吗?我可以查看任何开源代码吗?
第三个选项甚至有什么好处吗?也许我可以编写一个 Angular 服务并以某种方式对内联 SVG 进行分组,但我现在不知道。
亲切的问候,马辛