title: Angular web page needs refresh to load completely
body: <p>I have an angular 7 web app. As an example, when I log in, <code>routerLink</code> will redirect me to a page with header(menu), content and footer. I need to refresh that page once to load completely. Header is not loaded.</p>
  
  <pre><code>&lt;app-header&gt;&lt;/app-header&gt;
  &lt;router-outlet&gt;&lt;/router-outlet&gt;
  &lt;app-footer&gt;&lt;/app-footer&gt;
  </code></pre>
  
  <p>From header html, ts:</p>
  
  <pre class="lang-js prettyprint-override"><code>ngOnInit() {
    this.authenticate = this.authService.checkLogin();
    this.isDoctor = this.authService.checkDoctor();
  }
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>---------some sort of code----------
  &lt;div class="navbar-collapse collapse w-100" id="collapsingNavbar3" *ngIf="authenticate &amp;&amp; !isDoctor"&gt;
  </code></pre>
  
  <p>I don`t think is relevant, the problem persists without ngIf.</p>