what i should do to resolve this

Question

<------  Angular 9 -------->

- menuitem.service.ts

import { Injectable } from '@angular/core';

export class MenuItem {

  private state : string;

  private state2 : string;

  private state3 : string;

  private icon : string;

  private name : string;

  private module : string;

  private Menutem : any[]=[

  {state : 'client' , state2 : 'main' , state3 : 'interf' , icon : 'fas fa-file mr-2' , name : 'interface' , module : '1'}

   ,{state : 'admin' , state2 : 'main' , state3 : 'acc' , icon : 'fas fa-file mr-2' , name : "acceuil" , module : '2'}

 

   ,{state : 'chauf' , state2 : 'main' , state3 : 'camion' , icon : 'fas fa-file mr-2' , name : 'camion' , module : '3'}

   ];

  constructeur(){}

public getMenu() : any[]{

return this.Menutem;

}

  }

@Injectable({

  providedIn: 'root'

})

export class MenuitemService {

   Menu : MenuItem =new MenuItem();

  constructor() { }

  getMenu() : MenuItem[]{

return this.Menu.getMenu();

  }

}

- sidebar.component.html

  <ul class="navbar-nav" *ngFor="let men of getMenu()">

      <li class="nav-item" *ngIf="men.module === fonction">

        <a class="nav-link"  [routerLink]="['/',men.state,men.state2,men.state3]">

          <i [class]="[men.icon]"></i> {{men.name}}

        </a>

      </li>

    </ul>