Question

有人可以帮我这个代码吗？我有返回值的问题，控制器中的功能只返回

var products = {"id": 3};

我想从http.get收集价值，有人可以告诉我该怎么做？控制器：

$scope.product = {};
$scope.init = function () {
    $scope.loadProducts()
}

$scope.loadProducts = function () {
    // $http.get("/products/list").then(function (resp) {
    //  $scope.products = resp.data;
    // })
    $scope.products = getListProducts.loadProducts();
}

服务

var myServices = angular.module('myServices', []);
myServices.service('getListProducts', ['$http', function ($http) {
var products = {"id": 3};
this.loadProducts = function () {
    $http.get("/products/list").then(function (resp) {
        products = resp.data;
    })
    return products;
}
}]);

Answer 1

您在http成功之前返回产品，而是使用promises并在http成功时解析

$scope.product = {};
$scope.init = function () {
    $scope.loadProducts()
}

$scope.loadProducts = function () {
    // $http.get("/products/list").then(function (resp) {
    //  $scope.products = resp.data;
    // })
    $scope.productPromise = getListProducts.loadProducts();
      productPromise..then(function (resp) {
        $scope.products = resp.data;
    });
}

服务

var myServices = angular.module('myServices', []);
myServices.service('getListProducts', ['$http', function ($http) {
var products = {"id": 3};
this.loadProducts = function () {
    return $http.get("/products/list");

}
}]);

Answer 2

利用promises强制执行异步代码的序列化。

将您的服务方法重构为：

this.loadProducts = function () {
    var getProducts = new Promise(function(resolve,reject){
         $http.get("/products/list").then(function (resp) {
             resolve(resp.data);
         })
    });
    return getProducts;
};

您的Controller方法为：

 getListProducts.loadProducts().then(function(data){
   //success callback
   $scope.products = data;
 });

您也可以提供错误回调。希望这有帮助！

Answer 3

您应该使用promises从服务中返回值。您可以在服务中使用$q。它将有助于函数异步运行。

myServices.service('getListProducts', ['$http','$q', function ($http,$q) {
  var products = {"id": 3};
  this.loadProducts = function () {
   var deferred = $q.defer();

    $http.get("/products/list").then(function (resp) {
       products = resp.data;
       deferred.resolve(products);
     },function(error){
        deferred.reject(error);   
     });
   return deferred.promise;
 }
}]);

并且您在控制器中的方法应该处理success和error回调：

$scope.loadProducts = function () {

 getListProducts.loadProducts().then(function(response){
   $scope.products=response;
 },function(error){
   //your processing logic
 });
}

我希望这会对你有所帮助。

AngularJS服务不从http.get返回值

3 个答案: