angular-font-awesome

Angular2 Font Awesome

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

How to install

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

Import the module:

//...
import { AngularFontAwesomeModule } from 'angular-font-awesome/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"
],

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

To use the component you can choose between these 2 selectors: <ng2-fa></ng2-fa>, <fa></fa>, <ng4-fa><ng4-fa>, or <ng-fa><ng-fa>.

Name	Type	Options	Optional
name	String	F-A Icons	No
size	String	lg, 2x, 3x, 4x, 5x	Yes
fixed	Boolean	`true	false`
animation	String	`spin	pulse`
rotate	`Number	String`	`90
inverse	Boolean	`true	false`

Example Use

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

TODO

• Create basic demo
• Add directive option
• Add Stacked Icons support
• Add List Icons support