Custom component (or HTML) instead of menu title

[ykamchi]

Issue type

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

• bug report
• feature request

Issue description

It is not possible to place a custom component or at least HTML tags within the menu item. Currently the interface allow only string (title) ...

I would appreciate an example code to solve this limitation, even if it contains extending nebular framework classes.

Thx, Yohay

Current behavior:
menu item expect title, icon, link .... but not html string or angular component. So, there is no way to place at a menu button badge or anything other than string

Expected behavior:
Expecting to be able to initiate menu item with:
html:

Hello

or
component: <my-component [param1]="hello" [param2]="true">

Please advice,
Yohay

[ricmello]

@ykamchi since a menu is generated from an array of values, I think that wouldn't be a good choice to enable the usage of a component inside the menu. We would need apply a directive in the component template and pass it to the menu component with an alias to enable more than one template. I did it with another framework and the template became hard to read.

But sometimes we just want to create a bold span inside it, or add another simple thing that just a HTML tag would solve the problem. Looks more acceptable from the maintainers point of view. I can work on it.

[mruknowme]

Something like this would be really useful I think.
E.g. create menu via directives.

<nb-menu [items]="items" [autoCollapse]="true">
    <ng-template nbMenuItemTitle let-item>
       <span [inlineSVG]="item.data.iconUrl"></span> <span>{{ item.title }}</span>
       <!-- [inlineSVG] is a directive of another package
             I need this because my menu is dynamic and icons are just external urls -->
    </ng-template>
</nb-menu>

Is there any plans to implement this? (I don't know if that is even possible, just ideas)
How would I go about implementing this on my end? Maye possible to somehow extend component?