Angular 6: Font Awesome

(Last Updated On: 11. oktober 2018)

Font Awesome er en samling af ikoner baseret på en font. Den indeholder pt. knap 4000 ikoner hvoraf ca 1300 er gratis.

Jeg bruger ikonerne i et Angular 6 projekt og lagde ud med at benytte dem via angular-font-awesome …. lige indtil jeg skulle bruge thumbtack ikonet, som ikke blev vist. Men det er hvad der sker med små npm-pakker der vedligeholdes af enkeltpersoner. Super ærgerligt, for det er faktisk en godt tænkt pakke, der er meget simpel at benytte.

Men den er nu skrottet til fordel for @fortawesome/angular-fontawesome som er installeret på følgende vis:

I app.module.ts:


Bemærk at alle ikoner du vil benytte, skal importeres og føjes til library som vist i eksemplet herover.

Herefter kan du i et hvilket som helst component, bruge de importerede ikoner:

fas = free awesome solid
far = free awesome regular
fab = free awesome brand
Bemærk at fab ikoner ikke er inkluderet i mit eksempel … hvis du skal bruge disse, skal du blot tilføje @fortawesome/free-brands-svg-icons pakken.