title: How to handle boolean observables with the async pipe in Angular
body: <p>I have the following code:</p>
  
  <pre><code>public obs$: Observable&lt;boolean&gt;
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div *ngIf="(obs$ | async) === true || (obs$ | async) === false"&gt;
    {{ (obs$ | async) ? 'yes' : 'no' }}
  &lt;/div&gt;
  </code></pre>
  
  <p>It works as intended, but the <code>if</code> looks a little verbose.</p>
  
  <p>The problem is that I cannot simply do <code>&lt;div *ngIf="(obs$ | async)"&gt;</code>. If I try that, it will work in the case when the observable did not emit a value yet or if the value is true, but it will not work if the value is false, because the if will evaluate to false and the div is not displayed.</p>
  
  <p>I assume the same issue applies if a falsy value is returned, such as an empty string or 0.</p>
  
  <p>Is there a better, easier way of doing that?</p>