2016-07-06 11 views
1

私はjQueryをangularjsディレクティブに変換しようとしていましたが、以下のコードで何が間違っているのか分かりません。私は角度が非常に新しく、なぜこのコードが機能していないのか理解できません。jQuery slick.jsをangularjsディレクティブに変換する

HTML:

<div class="slider"> 
    <div class="slide-block"> 
    <i class="fa fa-lg fa-exchange"></i> 
    <h4>1</h4> 
    </div> 
    <div class="slide-block"> 
    <i class="fa fa-lg fa-exchange"></i> 
    <h4 > 2</h4> 
    </div> 
</div> 

JS:

angular.module('components').directive('slick', [ 
     'jquery', 
     function slick($) { 
     'use strict'; 

     var 
      scope = {}; 

     function link($scope, $element) { 


       $('.slider').slick({ 
      centerMode: false, 
      infinite: false, 
      centerPadding: '2px', 
      slidesToShow: 6, 
      speed: 200, 
      index: 2, 

      variableWidth: true, 
      responsive: [{ 
      breakpoint: 768, 
      settings: { 
       arrows: false, 
       centerMode: true, 
       centerPadding: '40px', 
       slidesToShow: 3 
      } 
      }, { 
      breakpoint: 480, 
      settings: { 
       arrows: false, 
       centerMode: true, 
       centerPadding: '40px', 
       slidesToShow: 1 
      } 
      }] 
     }); 

     } 

     return { 
      restrict: 'A', 
      scope: scope, 
      templateUrl: 'slick.html', 
      link: link 
     }; 
     } 
    ]); 
+0

それは働いていない理由は分からないのですが、あなたの代わりに '$の$要素を使用する必要があります(「スライダー」)'あなたは、私が試したディレクティブを複数回 – jantimon

+0

を使用している場合、それはまた、動作しますので、これはまだ動作していません –

+0

私の機能のリンク内でconsole.logを実行しても機能が動作していないように見えます。 –

答えて

関連する問題