QuerySelector不是Angular指令的函數

我想在開始時隱藏一個指令，當它仍在創建時。在這個指令中，我正在集成一個jQuery輪播。這是指令：QuerySelector不是Angular指令的函數

return { 
    restrict: 'E', 
    replace: true, 
    scope: true, 
    templateUrl: 'slick.html', 
    link: function(scope: any, element: any, attrs: any) { 
     scope.slickReady = false; 

     var slickEl = element.querySelector('.slick'); 
     if(slickEl){ 
      slickEl.on('init', function(){ 
       scope.slickReady = true; 
      }); 

       slickEl.slick({ 
        arrows: true, 
        autoplay: false, 
        dots: true, 
        infinite: false, 
        speed: 300, 
        slidesToShow: 4, 
        slidesToScroll: 4, 
        responsive: [ 
         { 
         breakpoint: 1024, 
         settings: { 
          slidesToShow: 3, 
          slidesToScroll: 3, 
          infinite: true, 
          dots: true 
         } 
         }, 
         { 
         breakpoint: 600, 
         settings: { 
          slidesToShow: 2, 
          slidesToScroll: 2 
         } 
         }, 
         { 
         breakpoint: 480, 
         settings: { 
          slidesToShow: 1, 
          slidesToScroll: 1 
         } 
         } 
        ] 
       }) 
     } 
    } 
}

這是主要的HTML：

<slick></slick>

這是slick.html：

<div ng-switch on="slickReady"> 
<div class="slick" ng-switch-when="true"></div> 
<div class="spinner" ng-switch-when="false"> 
    <div ng-repeat="item in todos"> 
    <img ng-src="{{item.face}}" class="md-avatar img-center"> 
    <p class="truncate">{{item.who}}</p> 
    </div> 
</div> 
</div>

的問題是，我在控制檯此錯誤：

TypeError: element.querySelector is not a function 
at Object.link (http://localhost/js/directives/slick.js:9:35)

編輯我試着這樣做：

var slickEl = element[0]querySelector('.slick'); 
if(slickEl.length > 0)

因爲，望着調試，「元素」是這樣構成的：

0:div length:1

這樣，我沒有錯誤，但旋轉木馬不建立。

來源

2016-08-01 panagulis72

也許你可以添加一個[mcve]的問題使用堆棧片段？這可能會幫助你更有效地得到有用的答案。 –

如果您正在使用jquery傳送帶，那麼它必須是tipical jquery。所以嘗試：

slickEl=$(element).find(".slick");

來源

2016-08-01 08:21:21

QuerySelector不是Angular指令的函數

回答

相關問題