title: Alert not displaying after page refresh/reload (Angular v10)
body: <p>I am developing an Angular single page app, where when the user clicks a button, the page is refreshed and a message is displayed.</p>
  <p>(TYPESCRIPT)</p>
  <pre><code>import { Component, OnInit, OnDestroy } from '@angular/core';
  
  export class newComponent implements OnInit, OnDestroy {
    showAlertMessage = false;
  
    buttonClicked(dataElement: DataModel): void {
      this.restService.postAction(dataElement, 'a new record is being inserted').subscribe();
      window.location.reload();
      this.showAlertMessage = true;
    }
  
  </code></pre>
  <p>(HTML)</p>
  <pre><code>&lt;table mat-table [dataSource]=&quot;dataSource&quot; multiTemplateDataRows class=&quot;mat-elevation-z8&quot;&gt;
    &lt;th mat-header-cell *matHeaderCellDef&gt; Header &lt;/th&gt;
      &lt;td mat-icon *matCellDef=&quot;let element&quot;&gt;
        &lt;button (click)=&quot;buttonClicked(element)&quot;&gt;No Data To Report&lt;/button&gt;
      &lt;/td&gt;
  &lt;/table&gt;
  
    &lt;div class=&quot;alert alert-primary&quot; *ngIf=&quot;showAlertMessage&quot; role=&quot;alert&quot;&gt;
      This is a primary alert—check it out!
    &lt;/div&gt;
  
  </code></pre>
  <p>The problem I am having is when the user clicks, the alert message briefly shows, then disappears while the page is refreshed. How do I reload the page, then display the message? Currently the message doesn't show after window.location.reload() occurs in the buttonClicked() method.</p>