Use @fortawesome/angular-fontawesome instead of whole css file

[CLSixteen]

Hello!

I would like to know if any update is planned about this. (maybe this is already possible?)

Thats quite sad that we have to load the entire font-awesome.css instead of only the few icons the gallery need using FontAwesomeModule. In my current project, I have to import AND FontAwesomeModule AND font-awesome.css which is not really efficient.

Thanks in advance for ur answers, have a great day!

[gitalvininfo]

Any updates for this? I only use arrow (left and right) and a close icon and I think its not necessary to load all font-awesome.css. Or maybe a custom icon would be possible ?

Thanks in advance.

[gitalvininfo]

I come here hoping for a workaround.

[PedroJesusRomeroOrtega]

Hi @gitalvininfo I had the same problem and I got it to work in this way:

In the module you are importing the awesome icons

+import { dom, library } from '@fortawesome/fontawesome-svg-core';
...
export class SharedModule {
  constructor(faIconlibrary: FaIconLibrary) {
    faIconlibrary.addIcons(faChevronRight);
    faIconlibrary.addIcons(faChevronLeft);
+  library.add(faChevronRight, faChevronLeft);
+  dom.watch();
  }
}

In the gallery options put the classnames of the icons

export const galleryOptions: NgxGalleryOptions[] = [
  {
+   arrowPrevIcon: 'fa fa-chevron-left',
+   arrowNextIcon: 'fa fa-chevron-right',
    thumbnailsArrows: true
}];

 <ngx-gallery [options]="galleryOptions"></ngx-gallery>