angular fontawesome code example
Example 1: font awesome angular
npm install --save @fortawesome/fontawesome-free
"styles": [
"node_modules/@fortawesome/fontawesome-free/css/all.css"
]
"scripts": [
"node_modules/@fortawesome/fontawesome-free/js/all.js"
]
<i class='fab fa-facebook'></i>
Example 2: font awesome install in angular
npm install --save font-awesome angular-font-awesome
import { AngularFontAwesomeModule} from 'angular-font-awesome';
imorts[
.../
AngularFontAwesomeModule,
],
Example 3: add font awesome to angular
<!--In the index.html-->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
Example 4: angular font awesome
ng add @fortawesome/angular-fontawesome@<version>
import { Component } from '@angular/core';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'font awesome usage';
faCoffee = faCoffee;
}
<fa-icon [icon]="faCoffee"></fa-icon>
Example 5: fontawesome angular
npm i font-awwsome
"styles"[
"node_modules/@fortawesome/fontawesome-free/css/fontawesome.css"
]
Example 6: how to use the downloaded fontawsoem icons in angula
"apps": [
{
"root": "src",
"outDir": "dist",
....
"styles": [
"styles.css",
"../node_modules/bootstrap/dist/css/bootstrap.css",
"../node_modules/font-awesome/css/font-awesome.css"
],
...
}
]
],