title: Angular 6 setTimeout and clearTimeout error
body: <p>I have an angular 6 strange problem.</p>
  
  <p>I am using setTimeout and clearTimeout functions to start/cancel the timeout.
  However this sometimes works, and sometimes doesn't.
  Even if the user triggers an (click) event and the clearTimeout is run, sometimes it forces player to draw two cards.</p>
  
  <p>Here is the code </p>
  
  <pre><code>//an event that says we must call uno 
  this._hubService.mustCallUno.subscribe(() =&gt; {
        this.mustCallUno = true;
        this._interval = window.setInterval(() =&gt; {
          this.countdown -= 100;
        }, 100);
        this._timer = window.setTimeout(() =&gt; {
          if (this.mustCallUno) {
              this.drawCard(2);
              this.callUno();
          }
        }, 2000);
      });
  
  // a function player calls from UI to call uno and not draw 2 cards
    callUno() {
      this.mustCallUno = false;
      window.clearTimeout(this._timer);
      window.clearInterval(this._interval);
      this.countdown = 2000;
    }
  </code></pre>
  
  <p>So even if the player calls callUno() function, the setTimeout is executed. Even worse, the code goes through the first if check inside the setTimeout <code>if( this.mustCallUno)</code> which by all means should be false since we just set it to false when we called callUno() function <code>this.mustCallUno = false;</code>.</p>
  
  <p>I used setTimeout (returns NodeJS.Timer) before window.setTimeout and the result was the same.</p>