This library is no longer maintained and I'd like to ask you to consider using other libraries such as https://github.com/FortAwesome/angular-fontawesome.
npm install --save font-awesome angular2-fontawesome/* package.json */ "font-awesome": "~4.7.0" # Use any versions "angular2-fontawesome": "~5.2.0" In package.json, insert following lines in the dependencies block:
We can import this library using SystemJS (systemjs.config.js):
// .angular-cli.json { "apps": [ // ... "styles": [ // Add this line "../../node_modules/font-awesome/css/font-awesome.css" ] // .. ] }// src/app/app.module.ts // .... // Add this import statement import { Angular2FontawesomeModule } from 'angular2-fontawesome/angular2-fontawesome' // .... @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, Angular2FontawesomeModule // Add this line ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }<!-- Component --> <fa [name]=string // name of fontawesome icon [size]=number // [1-5] [flip]=string // [horizontal|vertical] [pull]=string // [right|left] [rotate]=number // [90|180|270] [border]=boolean // [true|false] [spin]=boolean // [true|false] [fw]=boolean // [true|false] [inverse]=boolean // [true|false] ></fa> <!-- Directive --> <i fa [name]=string // name of fontawesome icon [size]=number // [1-5] [flip]=string // [horizontal|vertical] [pull]=string // [right|left] [rotate]=number // [90|180|270] [border]=boolean // [true|false] [spin]=boolean // [true|false] [fw]=boolean // [true|false] [inverse]=boolean // [true|false] ></fa><fa [name]="'rocket'"></fa> <!-- rendered --> <fa> <i class="fa fa-rocket"></i> </fa> <i fa [name]="'rocket'"></i> <!-- rendered --> <i fa class="fa fa-rocket"></i><fa [name]="'rocket'" [size]=1></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-lg"></i> </fa> <i fa [name]="'rocket'" [size]=1></i> <!-- rendered --> <i fa class="fa fa-rocket fa-lg"></i><fa [name]="'rocket'" [flip]="'horizontal'"></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-flip-horizontal"></i> </fa> <i fa [name]="'rocket'" [flip]="'horizontal'"></i> <!-- rendered --> <i fa class="fa fa-rocket fa-flip-horizontal"></i><fa [name]="'rocket'" [pull]="'right'"></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-pull-right"></i> </fa> <i fa [name]="'rocket'" [pull]="'right'"></i> <!-- rendered --> <i class="fa fa-rocket fa-pull-right"></i><fa [name]="'rocket'" [rotate]=90></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-rotate-90"></i> </fa> <i fa [name]="'rocket'" [rotate]=90></i> <!-- rendered --> <i class="fa fa-rocket fa-rotate-90"></i><fa [name]="'rocket'" [border]=true></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-border"></i> </fa> <i fa [name]="'rocket'" [border]=true></i> <!-- rendered --> <i fa class="fa fa-rocket fa-border"></i><fa [name]="'rocket'" [span]=true></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-span"></i> </fa> <i fa [name]="'rocket'" [span]=true></i> <!-- rendered --> <i class="fa fa-rocket fa-span"></i><fa [name]="'rocket'" [fw]=true></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-fw"></i> </fa> <i fa [name]="'rocket'" [fw]=true></i> <!-- rendered --> <i class="fa fa-rocket fa-fw"></i><fa [name]="'rocket'" [inverse]=true></fa> <!-- rendered --> <fa> <i class="fa fa-rocket fa-inverse"></i> </fa> <i fa [name]="'rocket'" [inverse]=true></i> <!-- rendered --> <i class="fa fa-rocket fa-inverse"></i>npm install typings --globaltypings installnpm link# /example npm install font-awesome npm link angular2-fontawesomeNow your change under /src directory will be reflected.
npm unlink - Support for
fa-stack - Support for
fa-liandfa-ul - FaStackDirective
- Test codes
- After the Angular2 guideline for test code is published
(MIT License) - Copyright (c) 2018 Komei Shimamura