Ligature based icons (i.e. Material icons) are not supported

[ItaiYosephi]

Issue type

I'm submitting a ... (check one with "x")

• bug report

Issue description

Current behavior:
When registering ligature font pack, nb-icon doesn't render the icon. the icon name needs to be rendered inside the HTML tag, not added as class.

Expected behavior:
Icon should be renderd.

Steps to reproduce:
register material icons font pack and try to render an icon
I was able fix it by using a custom NbIconlibraries :

@Injectable({ providedIn: 'root' })
export class CustomNbIconLibraries extends NbIconLibraries {
  protected createFontIcon(name: string, content: NbIcon | string, params: NbFontIconPackParams): NbFontIcon {
    if (content instanceof NbFontIcon) {
      return content;
    }
    return new NbFontIcon(name, params.ligature ? name : content, params);
  }

}

app-module.ts:

@NgModule({
  declarations: [AppComponent],
  imports: [
...
  ],
  providers: [{ provide: NbIconLibraries, useExisting: CustomNbIconLibraries }],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(private iconLibraries: NbIconLibraries) {
    this.registerMaterialIcons();
  }

  private registerMaterialIcons() {
    this.iconLibraries.registerFontPack("material-icons", {
      packClass: "material-icons",
      ligature: true
    });
    this.iconLibraries.setDefaultPack("material-icons");
  }
}

Related code:

StackBlitz StackBlitz Seed Project

[xPedrol]

I'm with the same problem