title: Angular 5 - Horizontal scrolling using buttons
body: <p>I have implemented horizontal scrolling of cards in an angular application. The scrolling is working fine. However, I would like to the give the user also the ability to scroll left or right, by clicking the "Left" and "Right" buttons. Each button should only scroll it's own <code>msgCardDeck</code>.</p>
  
  <p>Here's my code on StackBlitz:</p>
  
  <p><a href="https://stackblitz.com/edit/angular-atnq4z" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-atnq4z</a></p>
  
  <p>Here's my typescript to make it scroll, but it's not working. Would appreciate if there's a way to do this.</p>
  
  <pre><code>// Scroll Left if there is anything to scroll
    scrollLeft() {
      document.querySelector('div.msgCard').scrollLeft -= 500;
    }
  
  // Scroll Right if there is any area to scroll
  
    scrollRight() {
      document.querySelector('div.msgCard').scrollLeft += 500;
    }
  </code></pre>