Angular 5 Component/Directive for Fontawesome
npm install angular2-fontawesome``shell`
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):
`javascript
// .angular-cli.json
{
"apps": [
// ...
"styles": [
// Add this line
"../../node_modules/font-awesome/css/font-awesome.css"
]
// ..
]
}
`
`javascript
// 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 { }
`
`html
[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]
>
[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]
>
`
`html
`
`html
`
`html
`
`html
`
`html
`
`html
`
`html
`
`html
`
`html
`
`shell`
npm install typings --global
`shell`
typings install
`shell`
npm link
`shell`/example
npm install font-awesome
npm link angular2-fontawesome
Now your change under /src directory will be reflected.
``
npm unlink
- [ ] Support for fa-stackfa-li
- [ ] Support for and fa-ul`
- [ ] FaStackDirective
- [ ] Test codes
- After the Angular2 guideline for test code is published
(MIT License) - Copyright (c) 2018 Komei Shimamura