Angular Material - Empty Badge

Discussão em 'Angular' iniciado por Alexander Moser, Outubro 30, 2024.

  1. I'm currently adding badges to the buttons of the menu of my application, which already works fine. I want to display the number of notifications the user still has to look at like this:

    <span matBadge="4" matBadgeColor="warn">Look at these notifications!</span>


    On a mobile phone though, the menu is hidden behind a burger icon. I don't want the user to show how many notifications he has on top of this icon. I only want him to know that he has some, and when he opens the menu, he will see a badge with the number of notifications on the various buttons.

    My problem is that an empty badge is always hidden. I can't seem to show it like this:

    <span matBadge="" matBadgeColor="warn">Look at these notifications!</span>


    Is it not possible at all to show an empty badge? Am I missing something, or is this behaviour by design?

    Continue reading...

Compartilhe esta Página