Angular Font Awesome

September 6, 2018 ยท View on GitHub

NOTE: Support for this library has stopped at FontAwesome 4.7. If you are using FontAwesome 5+ use FontAwesome's own Angular library. link

Angular Font Awesome

Simple, easy to use Angular component to manage Font Awesome icons.

Built with Angular QuickStart Lib.

How to install

Install Packages npm install --save font-awesome angular-font-awesome

Import the module:

//...
import { AngularFontAwesomeModule } from 'angular-font-awesome';
@NgModule({
  //...
  imports: [
    //...
    AngularFontAwesomeModule
  ],
  //...
})
export class AppModule { }

If you're using Angular CLI, add the font-awesome CSS to styles inside the angular-cli.json

"styles": [
    "styles.css",
    "../node_modules/font-awesome/css/font-awesome.css"
],

If you're using Angular CLI 6.0.0, add the font-awesome CSS to styles inside the angular.json

"styles": [
    "styles.css",
    "./node_modules/font-awesome/css/font-awesome.css"
],

NOTE: If using SCSS preprocessor just change the css for scss

If you're not using the CLI, import the stylesheet to your index.html file

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />

Usage and options

NameTypeOptionsOptional
nameStringF-A IconsNo
sizeStringlg, 2x, 3x, 4x, 5xYes
fixedBooleantrue, falseYes
animationStringspin, pulseYes
rotateNumber, String90, 180, 270, horizontal, verticalYes
inverseBooleantrue, falseYes

Example Use

<fa name="cog" animation="spin"></fa>

TODO