title: Angular Material - Empty Badge
body: <p>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:</p>
  
  <pre><code>&lt;span matBadge="4" matBadgeColor="warn"&gt;Look at these notifications!&lt;/span&gt;
  </code></pre>
  
  <p>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.</p>
  
  <p>My problem is that an empty badge is always hidden. I can't seem to show it like this:</p>
  
  <pre><code>&lt;span matBadge="" matBadgeColor="warn"&gt;Look at these notifications!&lt;/span&gt;
  </code></pre>
  
  <p>Is it not possible at all to show an empty badge? Am I missing something, or is this behaviour by design?</p>