CODEWITHSUNDEEP
angularangular-materialangular-librarymat-icon
Mikael Thiago
Mikael Thiago

Reputation: 1

Use Angular Material mat-icon with custom svg icon in angular standalone library

I'm creating this angular library for a project, and inside it, i'm utilizing @angular/material mat-icon component. There is some custom svg files included as assets of library, and i want to register then with MatIconRegistry.addSvgIconSetInNamespace(path/to/assets/folter), and i do this, but i'm receiving the following error on runtime:

ERROR Error: Error retrieving icon XXX! Unable to find icon with the name "XXX"

I can't help it but to think that the problem is the url passed to addSvgIconSetInNamespace. I'm building the library with ng-packagr and including de svg folder in the final dist folder. My dist folder structure is like this:

dist/lib
  \+--assets
    \+--svgs
  \+--modules
    \+--icon.module.ts

And in icon.module is where i need to register the icons present in assets folder. Someone knows how to fix it? Tells if this is a problem in register or runtime reference?

I tried to register in the following ways: addSvgIconSetInNamespace('@lib/assets/svgs/some.svg') addSvgIconSetInNamespace('../assets/svgs/some.svg') addSvgIconSetInNamespace('/assets/svgs/some.svg')

But none of then worked.

Upvotes: 0

Views: 5164

Answers (1)

code_goes_brbrbr
code_goes_brbrbr

Reputation: 31

Have your tried to set icon retrieval up as a service as described here?

Upvotes: 1

Related Questions