search

czeckd / angular-svg-icon

Angular component and service for inlining SVGs allowing them to be easily styled with CSS.
http://czeckd.github.io/angular-svg-icon
MIT License
259 stars 38 forks source link

Is it possible to initialize svg-icons in typescript? #108

Open usamauzi opened 4 years ago

usamauzi commented 4 years ago

Hi, I am trying to initialize this in a typescript file using document.createElement to display in a map webapp as an overlay (openlayers).

let jtiImageElement = document.createElement('svg-icon'); jtiImageElement.setAttribute('src', 'assets/icons/jtis/1A.svg'); //jtiImageElement.setAttribute([stretch],"true"); //jtiImageElement['src'] =assets/icons/jtis/1A.svg; jtiImageElement['[svgStyle]'] = "{width.px:'100', height.px:'100'}";

ive tried initializing it this way, there is a svg-icon in the DOM but there is no image and the dimensions are 0x0. the url of the svg is also working.

czeckd commented 4 years ago

This svg-icon Angular component wasn't design for this type of use. Have you tired using the Angular approach by using a dynamic component loader?

usamauzi commented 4 years ago

Actually, this part of the code is being used in the ngoninit method. I am essentially trying to add some svg photos on a map using openlayers, and want to manipulate them to flash borders etc ( animate ).

czeckd commented 4 years ago

What version of Angular are you using?

usamauzi commented 4 years ago
Annotation 2020-07-22 143518
czeckd commented 4 years ago

Thanks. I've never attempted to use the component in the way that you're using it with document.createElement. If you want to provide code for a full reproducer, I can take a look some more at it. I tried to come up with a workable example, but no luck on my part.