我使用控制器将产品数据加载到$ 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]);
答案 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();
};
}]);