Light
Dark
System
Ask  Question

INLINESVG not working when I have a custom (my own) path.


I have an extension folder with an images path to put all my custom icons, but inlineSVG does not work when I refer to my SVGS. They do not load at all. When I put it inside the metronic assets folder they load fine.

Is there a predefined URL set by the module somewhere? I would like to use my own path.

Its in Angular


user
Kenneth Flores 2 weeks ago
Angular
4 Answers
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (4)

F
Faizal Author2 weeks ago

Hi,

It seems like your SVG files need to be placed under the src folder, and then you can reference them using a path starting with ./. For example:


[inlineSVG]=""./assets/media/svg/avatars/001-boy.svg""

This should allow you to use your custom path for SVG files in Angular with the InlineSVG module.

Thanks
user
Kenneth Flores 2 weeks ago

Here are the images proving it doesnt work.

https://drive.google.com/file/d/1rrZEg4rJyVhdOv-8xthUNRgiUYRE6nR8/view?usp=drive_link

https://drive.google.com/file/d/1hlI3xuiVbuPntO6zNmfYeuqAr1BDEARB/view?usp=drive_link

https://drive.google.com/file/d/1h8ybJ62M5euax1W9ZQOCTfjlKIWECZS0/view?usp=drive_link


user
Kenneth Flores 2 weeks ago

This does not work. It can’t find it even if I put it at Tio level.

./images/myfile.svg


F
Faizal Author2 weeks ago

I cannot open the link. Can you please make it public? Your images folder is inside src folder?

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Metronic

Go to MetronicDownloadsPurchase MetronicRefunds

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle