小编Chr*_*ton的帖子

angularjs slick js轮播ng-click不使用响应属性设置触发

我正在使用角度包装器https://github.com/vasyabigi/angular-slick来使用光滑的滑块。

我在各个幻灯片上都有一个ng-click设置,单击后会将用户带到其他页面。我使用响应式属性设置。

首次使用滑块加载视图时,一切正常。我可以单击超链接并接收click事件。但是,如果我更改触发断点设置之一的浏览器窗口的大小,则不再触发ng-click事件。

我认为问题与到达断点时,slick框架在幕后进行的销毁和重绘逻辑有关。

在遇到响应断点后,如何重新初始化angular以观察ng-click事件?

http://plnkr.co/edit/FCeE8AejXsjxWh6WR1wd

风景:

<h2>Single Item</h2>
    <slick class="slider single-item" data="this" current-index="index" responsive="breakpoints" slides-to-show=3 slides-to-scroll=3>
        <div ng-repeat="i in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]">
            <h3>{{ i }}</h3>
            <a ng-click="clickTheThing(i)" style="color:blue;">Click Here</a>
        </div>
        <p>Current index: {{ index }}</p>


    </slick>
Run Code Online (Sandbox Code Playgroud)

控制器:

$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
          }
      }, …
Run Code Online (Sandbox Code Playgroud)

angularjs slick angularjs-ng-click

5
推荐指数
1
解决办法
7999
查看次数

标签 统计

angularjs ×1

angularjs-ng-click ×1

slick ×1