如何在AngularJS中访问服务中的控制器变量

Question

我有一个ProductService可以提取数据并提供给ProductsController。这是代码。

sampleApp.factory('ProductService', ['$http', function ($http){ 
    var req = { 
     method: 'POST', 
     url: 'ProductData.txt', 
     //url: 'http://localhost/cgi-bin/superCategory.pl', 
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' }//, 
     //data: { action: 'GET' } 
    }; 

    return { 
     GetProducts: function() { 
      return $http(req); 
     }, 
     GetDetailInfo: function (ProductID) { 
      // HOW TO IMPLEMENT THIS 
     } 
    }; 
}]); 



sampleApp.controller('ProductsController', function ($scope, $routeParams, ProductService, ShoppingCartService) { 

    $scope.Products = []; 

    $scope.GetProducts = function() { 
     ProductService.GetProducts().then(
      function(response) { 
       if (response.data !== undefined) { 
        //alert (response.data); 
        console.log(response.data); 
        $scope.Products = response.data; 
       } 
       else { 
        alert ('undefined data'); 
       } 
      }, 
      function(Error) { 
       alert ('error worng'); 
      } 
     ); 
    }; 

    $scope.GetProducts(); 
}); 

现在我想在服务中实现一个功能，提供有关产品的详细信息。但是由于$ scope.Products在ProductService中不可用，我无法循环并获取所需ProductID的数据。

我想在ProductService中仅实现该功能，而不是在ProductsController中，因为某些其他服务（需要产品数据）会使用此ProductService。

如何解决这个问题呢？

如果有更好的架构来实现同样的目标，那也是值得欢迎的。

Answer 1

您需要在您的服务中重写GetProducts以将产品数据存储在服务中。

而不是返回$http(req)，解决服务内的承诺。

在成功回调中，通过在服务中声明变量来将响应数据存储在服务中。然后将承诺退还给控制器。

这应该可以解决您的问题。

示例代码：

sampleApp.factory('ProductService', ['$http', '$q', function ($http, $q){ 
    var req = { 
     method: 'POST', 
     url: 'ProductData.txt', 
     //url: 'http://localhost/cgi-bin/superCategory.pl', 
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' }//, 
     //data: { action: 'GET' } 
    }; 
    var productService = {}; 
    productService.products = []; 
    return { 
     GetProducts: function() { 
      var defer = $q.defer(); 
      $http(req).then(function(response) { 
       productService.products = response.data; 
       defer.resolve(productService.products); 
      }, function(error) { 
       defer.reject("Some error"); 
      }); 
      return defer.promise; 
     }, 
     GetDetailInfo: function (ProductID) { 
      // HOW TO IMPLEMENT THIS 
      // productService.products is available here. Loop through and find. 
     } 
    }; 
}]); 

在你的控制器：

$scope.GetProducts = function() { 
     ProductService.GetProducts().then(
      function(response) { 
        $scope.Products = response; 
      }, function(error) { 
      // your error code here 
      }); 
    };