title: angularjs slick js carousel ng-click not firing with responsive attribute settings
body: <p>I'm using the angular wrapper <a href="https://github.com/vasyabigi/angular-slick" rel="noreferrer">https://github.com/vasyabigi/angular-slick</a> to use the slick slider.</p>
  
  <p>I have a ng-click setup on my individual slides that will take users to a different page when clicked.  I using the responsive attribute setup.</p>
  
  <p>When the view first loads with the slider, everything works correctly. I can click the hyperlink and receive the click event.  However, if I change the size of the browser window that triggers one of the breakpoint settings, then the ng-click events no longer gets fired.</p>
  
  <p>I think the issue has to do with the destroy and redraw logic that the slick framework is doing under the covers when a breakpoint is reached.</p>
  
  <p>How do I re-initialize angular to watch for ng-click events after a responsive breakpoint has been hit?</p>
  
  <p><a href="http://plnkr.co/edit/FCeE8AejXsjxWh6WR1wd" rel="noreferrer">http://plnkr.co/edit/FCeE8AejXsjxWh6WR1wd</a></p>
  
  <p>The view:</p>
  
  <pre><code>&lt;h2&gt;Single Item&lt;/h2&gt;
      &lt;slick class="slider single-item" data="this" current-index="index" responsive="breakpoints" slides-to-show=3 slides-to-scroll=3&gt;
          &lt;div ng-repeat="i in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]"&gt;
              &lt;h3&gt;{{ i }}&lt;/h3&gt;
              &lt;a ng-click="clickTheThing(i)" style="color:blue;"&gt;Click Here&lt;/a&gt;
          &lt;/div&gt;
          &lt;p&gt;Current index: {{ index }}&lt;/p&gt;
  
  
      &lt;/slick&gt;
  </code></pre>
  
  <p>The controller:</p>
  
  <pre><code>$timeout(function () {
          return $scope.awesomeThings = ['HTML5', 'AngularJS', 'Karma', 'Slick', 'Bower', 'Coffee'];
      }, 1000);
  
  
      $scope.clickTheThing = function(theIndex) {
          console.log('clicked index' + theIndex);
          alert('clicked index' + theIndex);
      }
  
      return $scope.breakpoints = [
        {
            breakpoint: 768,
            settings: {
                slidesToShow: 2,
                slidesToScroll: 2
            }
        }, {
            breakpoint: 480,
            settings: {
                slidesToShow: 1,
                slidesToScroll: 1
            }
        }
      ];
  </code></pre>