Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

how to add a badge on the NbMenuComponent

See original GitHub issue

Issue type

I’m submitting a … (check one with “x”)

bug report
feature request

Issue description

Current behavior:

can not add badge on NbMenuComponent Expected behavior:

Steps to reproduce:

I try to add nb-badge in the title of the nb-menu items ,but it is not working, and show the html text not show the component. Related code:

insert short code snippets here

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->

Issue Analytics

State:
Created 5 years ago
Reactions:3
Comments:9

Top GitHub Comments

2reactions

nnixaacommented, Jun 22, 2018

Hey @jinxiu3939, unfortunately, there is no way to do this now, unless you copy over the menu component and manually modify its template. Hopefully, we see this feature in a new version of the menu component, which is planned but has no clear release date for now.

1reaction

seanbotha123commented, Aug 13, 2018

Hi,

I am looking for something similar, I need to add a button onto the item like so:

Top Results From Across the Web

Need to add badge in nebular menu - Stack Overflow

I would like to extend the question and ask if it is possible to place a custom component or at least HTML tags...

Menu Angular UI Component - Nebular - GitHub Pages

NbMenuComponent. Vertical menu component. Accepts a list of menu items and renders them ... Menu badge. Menu item badge. Default, Dark, Cosmic, Corporate ......

Menu Angular UI Component - component examples - Nebular

NbMenuComponent. Showcase. Default, Dark, Cosmic, Corporate ... Selected item: Add Menu Item Collapse all menu items. Home Get Selected Item. Live view.

CHANGELOG.md · Gitee 极速下载/Nebular - Gitee.com

Badge, button, progress bar, toastr components now use basic status as a ... menu: NbMenuComponent and NbContextMenuDirective now fire itemClick even if ...

nebular/theme/index.metadata.json - UNPKG

... <div *ngIf=\"imageBackgroundStyle\" class=\"user-picture image\" [style.background-image]=\"imageBackgroundStyle\">\n <nb-badge *ngIf=\"badgeText\" ...