fa fa icon in angular code example

Example 1: angular font awesome

ng add @fortawesome/angular-fontawesome@<version>

// 0.1.x	        angular 5.x	not supported
// 0.2.x	        angular 6.x	not supported
// 0.3.x	        angular 6.x && 7.x	not supported
// 0.4.x, 0.5.x	angular 8.x	not supported
// 0.6.x	        angular 9.x	supported
// 0.7.x	        angular 10.x	supported

// Usage
// Typescript
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;
}

// In html 
<fa-icon [icon]="faCoffee"></fa-icon>

Example 2: how to use fa-icon in angular

import { BrowserModule } from '@angular/platform-browser';import { NgModule } from '@angular/core'; import { AppComponent } from './app.component';import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; @NgModule({  imports: [    BrowserModule,    FontAwesomeModule  ],  declarations: [AppComponent],  bootstrap: [AppComponent]})export class AppModule { }