ui-route + resolve + factory
2017-07-10 本文已影响0人
赵碧菡
由列表页跳转详情页
路由
.state('home.product',{
url:'/product/:id',
templateUrl:'template/pages/home.product.html',
resolve:{
productsObj:function(getProduct){
//getProduct 自己定义的服务,getRequest()服务中定义的方法用来请求数据
return getProduct.getRequest().then(function(data){
return data;
});
}
},
controller:function($scope,$stateParams,productsObj,$window,funSer){
// funSer 自己定义的服务 ItemId服务中的方法通过id获取数据
$scope.product= funSer.ItemId(productsObj,$stateParams.id);
}
})
服务 -------- funSer
factory('funSer',function(){
return {
//通过ID查询某个产品
ItemId: function (arr, id) {
var obj = null;
angular.forEach(arr, function (item) {
if (item.productId == id) {
obj = item;
return;
}
})
return obj;
}
}
});
服务 -------- getProduct
factory("getProduct",function($q,$http){
var getRequest=function(){
var deferred=$q.defer();//创建deferred对象
$http({
url:'data/product.json',
method:'GET'
}).success(function(data){
deferred.resolve(data.all_products);
}).error(function(reason){
deferred.reject(reason);
});
return deferred.promise;
}
return {
getRequest:getRequest
}
});