title: Angular: refresh page seems to activate ngOnInit, but not OnDestroy
body: <p>So I'm working on a forum and a part of that forum is a section where I count how many members are currently online (registered and visitors). When people enter the forum I activate the code in my ngOninit() to add 1 to the document in my database that counts the amount of people currently using the forum. When I leave the forum, it activates the ngOnDestroy() and subtracts one.</p>
  
  <p>This adding 1 to the DB document seems to work fine. The problem however is that when I refresh the page with F5, that it doesn't subtract 1. I tried by adding <code>window.onbeforeunload = () =&gt; this.ngOnDestroy();</code> in my ngOnInit, but the problem didn't get solved this way. It keeps adding members even though it is just me refreshing the page a couple of times. This problem only occurs when I refresh, it's not an issue when I navigate through my website.</p>
  
  <p><strong>Can anyone make a suggestion on how to fix this?</strong></p>
  
  <p><strong>forumCount.component.ts</strong></p>
  
  <pre><code>export class ForumCountComponent implements OnInit, OnDestroy{
  
      data;
      ngUnsubscribe = new Subject();
  
      constructor(private authService: AuthenticationService, private forumService: ForumService){
  
      }
  
      ngOnInit(){
          let loggedIn = this.authService.isLoggedIn();
  
          this.forumService.forumCountPlus(loggedIn)
              .takeUntil(this.ngUnsubscribe)
              .subscribe((data) =&gt; {
                  this.data = data;
              });
  
          window.onbeforeunload = () =&gt; this.ngOnDestroy();
      }
  
      ngOnDestroy(){
          console.log('activated ngOnDestroy');
          let loggedIn = this.authService.isLoggedIn();
  
          this.forumService.forumCountMin(loggedIn)
              .takeUntil(this.ngUnsubscribe)
              .subscribe((data) =&gt; {
                  this.data = data;
                  this.ngUnsubscribe.next();
                  this.ngUnsubscribe.complete();
              })
      }
  }
  </code></pre>
  
  <p><strong>forumCount.component.html</strong></p>
  
  <pre><code>&lt;div class="row justify-content-center mb-5"&gt;
      &lt;div class="col-md-8"&gt;
          &lt;div class="card"&gt;
              &lt;p class="card-header"&gt;Who's Online?&lt;/p&gt;
              &lt;div class="card-body"&gt;
                  &lt;p class="card-text"&gt;In total there are {{data?.total}} users online :: {{data?.registered}} registered and {{data?.guests}} guests
                      &lt;br/&gt;
                      &lt;br/&gt;
                      The highest amount of online users was {{data?.highestNumber.num}} on {{data?.highestNumber.date | amDateFormat:'MMMM Do YYYY, h:mm:ss a'}}&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>