角度和jQuery的執行順序

我需要在主頁中渲染幾個傳送帶（和其他數據）。我有一項服務來獲取與頁面相關的所有數據（在單個請求中）。我正嘗試使用ng-repeat在每個輪播中呈現項目。還有一些jQuery腳本，需要在所有綁定之後執行（以呈現輪播和其他JQ組件）。角度和jQuery的執行順序

我的控制器看起來像：

angular.module("app").controller('homeController',['httpService', 
function (httpService) { 
    var vm = this; 
    vm.init = function() { 
     httpService.get('home/GetHomeData', {}).then(function(res) { 
      vm.data = res; 
     }) 
    } 
    vm.getFeaturedModels = function(){ 
     return vm.data.FeaturedProducts; 
    } 
}]);

和頁面：

<div class="wrapper" ng-controller="homeController as vm" ng-init="vm.init()"> 
... 
<ul class="list-inline owl-slider" > 
    <li class="item" ng-repeat="m in vm.data.FeaturedModels"> 
        {{m.Name}} 
    </li> 
</ul> 
... 
<script> 
    jQuery(document).ready(function() { 
     App.init(); 
    }); 
</script>

當我運行的應用程序，它提供了奇怪的結果。首先，它不顯示傳送帶，並且出現錯誤 - FeaturedProducts of undefined。我想這是因爲ng-repeat在ajax完成之前得到執行。

經過一番研究，我將ng-repeat調用改爲直接數據對象（vm.data.FeaturedProducts而不是vm.getFeaturedProducts()）。雖然聽起來不太好，但它的工作沒有錯誤。但是，旋轉木馬不會按照它應有的方式呈現。一些動態創建的div不合適。我想在ng-repeat完成任務之前腳本已經被執行了。

另外，我試圖執行承諾後的腳本。它沒用。

在這種情況下，有沒有一種方法控制訂單執行？或者我錯過了什麼？

來源

2016-09-13 Krishna Sarma

的ngReapeat的，所以它不是，它的Ajax之前執行的情況下，對模式的變革執行，$http返回不同的響應包含數據對象，因此它應該是vm.data = res.data或vm.data.data.FeaturedModels這就是爲什麼你所得到的FeaturedProducts of undefined

angular.module("app").controller('homeController',['httpService', '$timeout', 
function (httpService, $timeout) { 
    var vm = this; 
    vm.init = function() { 
     httpService.get('home/GetHomeData', {}).then(function(res) { 
      vm.data = res.data; 
     }).then(function(){ 
      $timeout(function(){ 
      //jQuery code to create carousels, $timeout ensures that the code will run in next $digest cycle so after DOM from ngRepeat get's created 
      }) 
     }) 
    } 
    vm.getFeaturedModels = function(){ 
     return vm.data.FeaturedProducts; 
    } 
}]);

來源

2016-09-13 08:41:03 maurycy

角度和jQuery的執行順序

回答

相關問題