Hello.
I have svgs inline in my html template (components) and now it looks messy. I want to make it cleaner - put svg code in seperate .html files and include them in component’s html template. How to do it?
To include separate html’s its better to create separate component for svgs and use its selector wherever you need it
I have to manipulate these svg like animations etc and these components which I am using are duplicated many times. So for each svg component I will have to create unique id and from main component remember svg component id. It’s too complicated and it will make the code messy.
By the way, creating 20 or even more svg components? - looking for better idea 
you don’t need to create 20 components, you can just create 1 component and put all your svgs in that single component and you can use @Input() on svg component something like
<my-svg [data]="listOfSvgsTobeShown"></my-svg>
So you can do something like hide shown