Angularjs指令ng-repeat和ajax

Question

我有一個指向鏈接到jquery ticker插件調用。在指令裏面我有一些重複的插件循環。元素中的數據本身包含來自ajax請求。

下面是代碼

myApp.directive('vTicker', ['$timeout', function($timeout) { 

return { 

    link: function($scope, iElm, iAttrs, controller) { 
     $timeout(function() { 
      // console.log($(iElm).html()); 
      $(iElm).vTicker($scope.$eval(iAttrs.vTicker));    
     }, 0); 
    } 
}; 
}]); 

這裏是元素

<div id="newsticker" v-ticker="{speed: 400,pause: 6000}"> 
     <ul class="list-unstyled"> 
      <li class="news-item" ng-repeat="newsItem in news"> 
       <a href="http://www.nasdaqdubai.com/trading/disclosure-detail?itemID="{{newsItem.id}} target="_blank">{{newsItem.issuer}} : {{newsItem.headline}}</a> 
       </li> 
     </ul> 

問題是，當指令呈現時，NG-重複處理不當完成渲染。 $ timeout沒有幫助，因爲內容來自控制器中的ajax調用。

任何幫助？我希望指令等待渲染，直到控制器獲取數據並且ng-repeat在dom中呈現內容爲止。

謝謝。

Answer 1

假設項目被添加到news數組中。你需要做的是觀看news陣列，看看它什麼時候被填滿，然後應用你的股票代碼。 您當前的指令定義不創建一個新的範圍，所以，news陣列將訪問，以便喲，如果你重新分配您的news陣列這款手錶將火可以這樣做

link: function($scope, iElm, iAttrs, controller) { 
    $scope.$watch("news", function(newValue,oldValue) { 
     if(newValue && newValue.length > 0) { 
     $timeout(function() { 
      // console.log($(iElm).html()); 
      $(iElm).vTicker($scope.$eval(iAttrs.vTicker));    
      }, 0); 
     } 
     } 
    } 
} 

現在。您也可以使用隔離範圍傳遞news陣列。