Angularjs：在http請求中等待很長時間後設置/返回作用域

我有一個服務正在呼叫UPS api並返回一個承諾。請求和回報平均需要3-4秒。返回後，我試圖爲$ scope.printOrder設置一個範圍。看起來Angular在這麼長的等待時間裏並沒有發生變化。我有什麼選擇讓Angular等待這個請求，還是我正在做其他事情呢？Angularjs：在http請求中等待很長時間後設置/返回作用域

感謝

服務

ordersApp.factory('upsPrint', function ($http, $q) 
    { 
     return { 
      upsPrint: function (order) 
      { 
       var deferred = $q.defer(); 

       $http.post('orders/upsPrint',{order: order}).success(function(data) 
       { 
        deferred.resolve(data); 
       }); 

       return deferred.promise; 
      } 
     }; 
    });

控制器

$scope.printOrder = function (order) 
    { 
     $scope.printingOrder = upsPrint.upsPrint(order); 

     $scope.printingOrder.then(function(upsPrint){ 
      $scope.printedOrder = upsPrint.printedOrder; 
      console.log($scope.printedOrder); 
     }); 
    };

查看

<div ng-controller="ordersCtrl"> 
    <div ng-model="printedOrder"> 
     {{printedOrder}} 
    </div> 
</div>

來源

2013-08-05 Bungdaddy

是否超時？ – zsong

不會超時。它通過console.log（$ scope.printedOrder） – Bungdaddy

確認返回數據，所以，我隨即將$ scope.printedOrder更改爲$ scope.printLabel。有$ scope.printedOrder和upsPrint.printedOrder似乎是問題......需要我的頭圍繞那一個。 – Bungdaddy

您應該在HTML層次結構no ng-model中在該div或其上的某個位置定義ng-controller。

這裏有一個小提琴，顯示它的工作：

http://jsfiddle.net/5ZJrH/

我不得不更新在括號中的數值{{}}因爲在範圍的控制變量名是不同的。

的JS

ordersApp = angular.module("ordersApp", []); 



ordersApp.factory('upsPrint', function ($http, $q) 
    { 
     var service = { 
      printedOrder:{}, 
      upsPrint: function (order) 
      { 
       var deferred = $q.defer(); 
       deferred.resolve("test"); 
       service.printedOrder = "test"; 
       //$http.post('orders/upsPrint',{order: order}).success(function(data) 
       //{ 
       // deferred.resolve(data); 
       //}); 

       return deferred.promise; 
      } 
     }; 
     return service; 
    }); 


ordersApp.controller("ordersCtrl", function($scope, upsPrint) { 
    $scope.printOrder = function (order) 
    { 
     $scope.printingOrder = upsPrint.upsPrint(order); 

     $scope.printingOrder.then(function(upsPrint){ 
      $scope.printedOrder = upsPrint.printedOrder; 
      console.log($scope.printedOrder); 
     }); 
    }; 

    $scope.printOrder(1); 
});

的HTML

<div ng-app="ordersApp" ng-controller="ordersCtrl"> 
    <div> 
     {{printingOrder}} 
    </div> 
</div>

我再次更新小提琴只使用控制器返回的承諾，我讀過，這工作正常，但沒有使用它在我的任何代碼尚未：

http://jsfiddle.net/5ZJrH/1/

來源

2013-08-05 01:56:39 shaunhusain

對不起，我的問題排除在外。它位於HTML層次結構的div中，將更新顯示的問題。 – Bungdaddy

由於upsPrint返回一個承諾，那麼做這個

$scope.printingOrder = upsPrint.upsPrint(order);

將只分配承諾printedOrder，這是不正確的事情。您可以嘗試

upsPrint.upsPrint(order).then(function(data){ 
    $scope.printingOrder = data; 
});

來源

2013-08-05 02:56:30 zsong

他實際上在範圍中使用了2個不同的值：printingOrder和printedOrder。我認爲你沒有理解，但我同意將承諾放在範圍內在這裏沒有用處。 – Greg

Angularjs：在http請求中等待很長時間後設置/返回作用域

回答

相關問題