Ionic HTTP請求延遲更新

Question

我有一個基本的離子應用程序列出了頁面上的作業，當點擊一個作業時，這會調用我的REST API並返回該作業中的人員。

我的問題是，當作業被點擊時，頁面加載時沒有數據，然後如果我拉來刷新頁面顯示結果？

當頁面顯示時，我拉動刷新後，人們的結果應該已經不存在了嗎？

有誰知道爲什麼我的結果不顯示在網頁加載？

我的工作列表

Job 1 <a href="#/job/1">Begin</a> 
Job 2 <a href="#/job/2">Begin</a> 
Job 3 <a href="#/job/3">Begin</a> 

當點擊一個作業本加載我的狀態&控制器

國家

.state('job', { 
     url: '/job/:jobID', 
     templateUrl: 'templates/job.html', 
     controller: 'jobCtrl' 
    }) 

控制器

.controller('jobCtrl', function($scope, $stateParams, $http, $state) { 

    $scope.jobId = $stateParams.jobID; 

    $scope.data = {}; 

    $http.get('https://domain/api/job?token=' + localStorage.getItem("token") + '&job_id=' + $scope.jobId).then(function(successResponse){ 

    $scope.return = successResponse; 
    $scope.data = $scope.return.data.data; 

    }, function(errorRepsonse){ 
     $scope.error = errorRepsonse; 
    }); 

    $scope.doRefresh = function() { 

    $http.get('https://domain/api/job?token=' + localStorage.getItem("token") + '&job_id=' + $scope.jobId).then(function(successResponse){ 

    $scope.return = successResponse; 
    $scope.data = $scope.return.data.data; 

    $scope.$broadcast('scroll.refreshComplete'); 

    }, function(errorRepsonse){ 
     $scope.error = errorRepsonse; 
    }); 

    }; 

}) 

顯示人物結果的視圖。

<ion-refresher 
    pulling-text="Pull to refresh..." 
    on-refresh="doRefresh()"> 
</ion-refresher> 

<ion-nav-back-button class="button-clear"> 
<i class="ion-arrow-left-c"></i> Back 
</ion-nav-back-button> 

<ion-list> 
    <ion-item class="item-remove-animate item-icon-right" ng-repeat="person in data" type="item-text-wrap"> 
     <h2>{{person.name }}</h2> 
    </ion-item> 
</ion-list> 

Answer 1

您可以使用解決

.state('job', { 
    url: '/job/:jobID', 
    templateUrl: 'templates/job.html', 
    controller: 'jobCtrl', 
    resolve: { 
     job: function($stateParams, $http){ 
      return $http.get(...).then(function(resp){ 
       ... 
       // return job data 
       }); 
     } 
    } 
}) 

... 

然後在你的控制器

.controller('jobCtrl', function($scope, job, $http, $state) { 
    $scope.job = job; 

你的控制器將只job運行後得到解決。 $http.get()返回一個承諾：

此外，您還可以同時加載

更新

爲了把事情說清楚顯示裝載機。一旦諾言得到解決，那麼你的控制器功能將被執行。最後，$http.get應該返回您想要在控制器內部使用的數據（在這種情況下是作業信息）。

這樣您就不需要在控制器內異步啓動信息獲取。你的控制器從數據開始，應該保持簡單。