title: What would be correct condition for displaying different alerts in Angular?
body: <p>I created contact form and i'm handling if request is success or has errors.</p>
  <p>In BehaviourSubject i store true or false.</p>
  <ul>
  <li>success = true</li>
  <li>errors = false</li>
  </ul>
  <p>Now i would display correct alert after submitting form.</p>
  <p>When value has:
  0 - alerts should be disabled
  true - display success alert
  false - display error alert</p>
  <p>With what condition i can achieve that? Because currently success is displaying from the begining... and after clickin on X button nothing is changing.</p>
  <p>My playground:</p>
  <pre class="lang-js prettyprint-override"><code>isValid$ = new BehaviorSubject&lt;any&gt;(null);
      ngOnInit(): void {
          this.isValid$.subscribe();
      }
  
     closeAlert() : void {
      this.isValid$.next(null);
  }
  </code></pre>
  <pre class="lang-html prettyprint-override"><code>&lt;!-- ALERT --&gt;
  &lt;div *ngIf=&quot;isValid$&quot; class=&quot;alert alert-success alert-dismissible fade show mt-5&quot; role=&quot;alert&quot;&gt;
      &lt;!-- Success --&gt;
      &lt;button type=&quot;button&quot; class=&quot;btn-close&quot; data-bs-dismiss=&quot;alert&quot; aria-label=&quot;Close&quot; (click)=&quot;closeAlert()&quot;&gt;&lt;/button&gt;
  &lt;/div&gt;
  
  &lt;div *ngIf=&quot;!isValid$&quot; class=&quot;alert alert-danger alert-dismissible fade show mt-5&quot; role=&quot;alert&quot;&gt;
      &lt;!-- Error --&gt;
      &lt;button type=&quot;button&quot; class=&quot;btn-close&quot; data-bs-dismiss=&quot;alert&quot; aria-label=&quot;Close&quot; (click)=&quot;closeAlert()&quot;&gt;&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>