title: Using setTimeout() in Angular $rootScope event
body: <p>I'm using an Angular plugin called ng-cart to add a shopping cart to my website.</p>
  
  <p>The ng-cart plugin broadcasts an event when and item is added to the shopping cart.</p>
  
  <p>I would like it to display the shopping cart summary then fade out using the setTimeout() function each time an item is added.</p>
  
  <pre><code>    $rootScope.$on('ngCart:itemAdded', function (event, data) {         
          if(!$('#cart-summary-container').is(":visible"))  {         
              $('#cart-summary-container').fadeIn('fast');
              clearTimeout(myVar);
              myVar = setTimeout(function() { $('#cart-summary-container').fadeOut('fast'); }, 2000); 
          }       
      }); 
  </code></pre>
  
  <p>The problem is I need to cancel the setTimeout() function if another item is added so that it displays for the 2 seconds.</p>
  
  <p>I have tried to clearTimeout(myVar) before resetting the timeout.</p>
  
  <p>I'm sure there is an easy solution to this I'm missing. Any help appreciated.</p>