search

arkon / ng-inline-svg

[Inactive] Angular directive for inserting an SVG file inline within an element.
https://echeung.me/ng-inline-svg/
MIT License
210 stars 88 forks source link

Setting widths or other attributes #97

Closed silverjerk closed 5 years ago

silverjerk commented 5 years ago

Looking for a simple solution for this; used search and could not find any help with this particular issue. The usage of certain SVG's in our project is varied, and we're often building complex images using multiple SVG's; this makes it easier for us to set explicit widths on some SVG files, rather than specifying widths using classes.

For instance, I'm setting a specific width here: <img src="../assets/img/svg/icons/weather-icon.svg" alt="" width="20" />

Is it possible to achieve the same thing using InlineSVG? As an example, how would I do this using the following code in my Angular template: <div class="weather-icons" [inlineSVG]="'../assets/img/svg/icons/weather-icon.svg'"> </div>

I realize this may be a best of both worlds scenario, since in one case we're using img tags, and in the other we're rendering the SVG inline, but if it were possible it would resolve some complexity in our current project.

Thanks for the assistance!

wottpal commented 5 years ago

This is so awesome you have implemented this @arkon! I was just looking for it. How can I use it in my Angular project as the most recent release is still 8.3.0?

Dennis

arkon commented 5 years ago

Published in v8.4.0.

wottpal commented 5 years ago

🤩so fast! thanks thanks thanks