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
            }

        });

上一篇下一篇

猜你喜欢

热点阅读