title: How to handle carousel buttons from Angular component in ngx-slick-carousel
body: <p>I'm using <a href="https://www.npmjs.com/package/ngx-slick-carousel" rel="nofollow noreferrer">ngx-slick-carousel</a> to implement a slick carousel for the Angular app.</p>
  <p>How to create the <code>next</code> and <code>prev</code> methods to switch slides from the component?</p>
  <p>This is my html:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;ngx-slick-carousel class=&quot;carousel&quot; #slickModal=&quot;slick-carousel&quot; [config]=&quot;slideConfig&quot; (init)=&quot;slickInit($event)&quot; (breakpoint)=&quot;breakpoint($event)&quot; (afterChange)=&quot;afterChange($event)&quot; (beforeChange)=&quot;beforeChange($event)&quot;&gt;
      &lt;div ngxSlickItem *ngFor=&quot;let slide of slides&quot; class=&quot;slide&quot;&gt;
          &lt;img [src]=&quot;slide.image&quot; alt=&quot;&quot; width=&quot;100%&quot;&gt;
      &lt;/div&gt;
  &lt;/ngx-slick-carousel&gt;
  </code></pre>
  <p>config:</p>
  <pre class="lang-js prettyprint-override"><code>slideConfig = {
      centerPadding: '60px',
      slidesToShow: 2,
      slidesToScroll: 1,
      arrows: false
  };
  </code></pre>