从api休息获取的商店数据的角度提供者(服务)?

时间:2015-01-30 01:58:52

标签: angularjs http config provider

我使用控制器将产品数据加载到$ rootScope数组中。我使用$ http服务并且工作正常,但现在我有了一个新函数来获取要加载的产品数量。我无法使用该功能导致响应缓慢。 我想知道在应用程序启动之前是否可以使用提供程序加载要在config方法中获取的产品数量。如果我可以将$ rootScope数组移动到一个服务。我不理解Angular文档,即使是教程,它们也不是很有用,至少在提供者和服务中......

app.controller('AppController', [ '$rootScope', '$http', function ( $rootScope,$http) {

$rootScope.empty = 0;
$rootScope.products = [];
$rootScope.lastId = 0;
$rootScope.getLastID = function () {
 $http.get("app_dev.php/api/products?op=getLastId").success(function (data) {
 $rootScope.lastId = data.lastId;
});
};
$rootScope.getProducts = function () {
  if ($rootScope.empty === 0) {
   for (i = 1; i < 100; i++) {
    $http.get("app_dev.php/api/product/" + i).success(function (data) {
     $rootScope.products.push(data);
    });
   }
  }
 $rootScope.empty.productos = 1;
  };
 }

我用工厂和服务完成了这项工作但是没有工作。

app.factory('lastProduct', ['$http', function lastProductFactory($http) {
this.lastId;
var getLast = function () {
  $http.get("app_dev.php/api/products?op=getLastId").success(function (data)  {
    lastId = data.lastId;
 });

                    return lastId;
                };

                var lastProduct = getLast();

                return lastProduct;
            }]);

        function productList($http, lastProduct) {
            this.empty = 0;
            this.lastId = lastProduct();
            this.products = []

            /*this.getLast = function () {
                lastId = lastProduct();
            };*/
            this.getProducts = function () {
                if (empty === 0) {
                    for (i = 1; i < lastId; i++) {
                        $http.get("app_dev.php/api/product/" + i).success(function (data) {
                            products.push(data);
                        });
                    }
                }
                empty = 1;
                return products;
            };

        }

        app.service('productsList', ['$http', 'lastProduct' , ProductsList]);

3 个答案:

答案 0 :(得分:1)

服务在配置期间不可用,只有提供者因此你不能使用$ http来获取配置块中的值,但是你可以使用run block,

你可以做到

angular.module('app',['dependencies']).
 config(function(){
  //configs
 })
 .run(function(service){
   service.gerValue()
})

将检索到的值设置在服务内或值内是一个好主意,以避免污染根作用域,这样在实例化服务之前检索值,并且可以将检索到的值作为依赖项注入

答案 1 :(得分:0)

制作那么多小的$ http请求似乎不是一个好主意。但是使用工厂存储要在控制器之间使用的数据数组看起来像这样。要使用工厂,您需要返回暴露的api。 (这种风格在使用服务时使用。我建议谷歌搜索不同的,但我更喜欢工厂)。如果您需要提醒其他控制器数据已更改,您可以使用事件。

angular
    .module('myApp')
    .factory('myData', myData);

function myData($http, $rootScope) {
    var myArray = [], lastId;

    return {
        set: function(data) {
            $http
                .get('/path/to/data')
                .then(function(newData) {
                    myArray = newData;

                    $rootScope.$broadcast('GOT_DATA', myArray);
                })
        },
        get: function() {
            return myArray
        },     
        getLast: function() {
             $http
                .get('/path/to/data/last')
                .then(function(last) {
                    lastId = last;

                    $rootScope.$broadcast('GOT_LAST', lastId);
                })
        }
    }
}

然后从任何控制器中注入工厂并根据需要获取和设置数据。

angular
    .module('myApp')
    .controller('MainCtrl', MainCtrl);

function MainCtrl($scope, myData) {
    $scope.bindableData = myData.get(); // get default data;

    $scope.$on('GOT_DATA', function(event, data) {
       $scope.bindableData = data;
    })
}

我希望这会有所帮助。如果您有任何问题,请告诉我。

答案 2 :(得分:0)

我这样做但没有奏效。从某个控制器调用set方法时,rootScope total未定义。 http://imgur.com/qEl5WV5 但使用10代替罗氏镜总数 http://imgur.com/t6wB3JZ 我可以看到rootScope total var在其他人之前到达... (app_dev.php / api / productos?op = ultimaIdProductos)vs(app_dev.php / api / producto / x)

           var app = angular.module('webui', [$http, $rootScope]);

            app.run (function ($http, $rootScope){

                $http.get("app_dev.php/api/products?op=getLastId").success(function (data) {
                    $rootScope.total = data.ultima;                    
                });

            });

                function myData($http, $rootScope) {
                    var myArray = [];

                    return {            
                        set: function () {
                            console.log($rootScope.total);
                            for (i = 1; i < $rootScope.total; i++) {
                                $http.get("app_dev.php/api/product/" + i).success(function (data) {
                                    myArray.push(data);
                                })
                            }

                        },
                        get: function () {
                            return myArray;
                        }
                    }
                }

    app.controller('AppController', ['$http', '$rootScope', 'myData', function ($http, $rootScope, myData) {

                $rootScope.productos = [];

                $rootScope.getProductos = function () {

                    console.log($rootScope.total);
                    myData.set();
                    $rootScope.productos = myData.get();


                };

}]);