add new icons to menu item using font awesome

src/app/app.component.html

@@ -8,8 +8,6 @@
     </ng-template>
   </kendo-menu>
 </div>
-<fa-icon ngif [icon]="faCoffee"></fa-icon> &nbsp; text
-<fa-icon  [icon]="faCoffee"></fa-icon> &nbsp; text
 <router-outlet></router-outlet>
 
 

src/app/app.component.ts

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { faCoffee } from '@fortawesome/free-solid-svg-icons';
+
 import { mainMenuItems } from './main-menu-items';
 
 @Component({
@@ -8,12 +8,12 @@ import { mainMenuItems } from './main-menu-items';
   styleUrls: ['./app.component.scss']
 })
 export class AppComponent {
-  faCoffee = faCoffee
+
   title = 'broker';
   public items: any[] = mainMenuItems;
 
   public hasFa (item: any) : boolean {
-    console.log(item);
+    //console.log(item);
     return item.hasOwnProperty('fa');
   }
 }

src/app/main-menu-items.ts

@@ -1,16 +1,15 @@
-import { faCoffee } from '@fortawesome/free-solid-svg-icons';
+import { faChartArea, faChartPie, faIdCard, faIdCardAlt, faMoneyCheck, faUniversity, faUserCircle } from '@fortawesome/free-solid-svg-icons';
 
 export const mainMenuItems: any[] = [
     {
         text: '',
-        icon: 'menu'
+        fa: faUniversity
     },
     {
         text: 'SFM',
         icon: 'more-vertical',
-        fa: faCoffee,
         items: [
-            { text: 'Summary', icon: 'calculator', url: './#dashboard'}, 
+            { text: 'Summary', fa: faChartArea, url: './#dashboard'}, 
             { text: '--', separator: "true"  }, 
             { text: 'Logout', icon: 'logout', url: './#login'}]
     },
@@ -40,7 +39,7 @@ export const mainMenuItems: any[] = [
         icon: 'user',
         items: [
             { text: 'Add ', icon: 'plus', url: 'https://google.com.au' }, 
-            { text: 'List All', icon: 'table' }, 
+            { text: 'List All', fa: faIdCard }, 
             { text: '--', separator: "true"  }, 
             { text: 'Search' ,icon: 'search'},
             { text: '--', separator: "true"  }, 
@@ -50,10 +49,10 @@ export const mainMenuItems: any[] = [
 
     {
         text: 'Brokers',
-        icon: 'user',
+        fa: faUserCircle,
         items: [
             { text: 'Add ', icon: 'plus', url: 'https://google.com.au' }, 
-            { text: 'List All', icon : 'table' }, 
+            { text: 'List All', fa: faIdCardAlt}, 
             { text: '--', separator: "true"  }, 
             { text: 'Search' , icon: 'search'},
             { text: '--', separator: "true"  },