I have a lot of svg icons that I want to style using CSS. Same icons can be used on different places across the app. I’ve seen components that retreive and inject svg icons from file, such as angular2-svg-icon, but that results in many server requests
My solution in Angular1 was to write sources of all svg icons in a .js file and writting a directive that injected those icons in the html elements.
Eg:<div class="svgIcon icon-house" svg-icon-replace></div> was replaced with appropriate svg icon of a house.
Source of the svg icons was compiled and minified into a single src.js with the rest of the app, to optimize loading times.
Any opinion on that?