AngularJS服务JSON文件数据加载到一个服务对象

Question

我是相当新的角度，我试图建立一个角商店应用下面的教程 - >Link

我感到困惑的部分是服务和使用的数据种类。代码的结构如下

app.js

(function(){ 
var storeApp = angular.module('AngularStore', ['ngRoute']); 

storeApp.config(function($routeProvider) { 
    $routeProvider 
    .when('/store', { 
    templateUrl: 'partials/store.html', 
    controller: 'storeController' 
    }) 
    .when('/products/:productSku', { 
    templateUrl: 'partials/product.html', 
    controller: 'storeController' 
    }) 
    .when('/products1/:productId', { 
    templateUrl: 'partials/product1.html', 
    controller: 'storeController' 
    }) 
    .when('/cart', { 
    templateUrl: 'partials/shoppingCart.html', 
    controller: 'storeController' 
    }) 

    .otherwise({ 
    redirectTo: '/store' 
    }); 
}); 

storeApp.controller('storeController', function($scope, $http,$routeParams, DataService) { 

// get store and cart from service 
$scope.store = DataService.store; 
$scope.cart = DataService.cart; 

// use routing to pick the selected product 
if ($routeParams.productSku != null) { 
    $scope.product = $scope.store.getProduct($routeParams.productSku); 
} 

if ($routeParams.productId != null) { 
    $scope.product1 = $scope.store.getProduct1($routeParams.productId); 
} 

}); 


/**create a data service that provides a store and a shopping cart that will be shared by all views (instead of creating fresh ones for each view). **/ 

storeApp.factory("DataService", function ($http) { 

// create store 
var myStore = new store(); 

// create shopping cart 
var myCart = new shoppingCart("AngularStore"); 

// return data object with store and cart 
return { 
    store: myStore, 
    cart: myCart 
}; 
}); 

})(); 

接着它有数据定义的其他两种文件：

store.js

function store() { 

this.products1=[ 
new product1("1", "Grr", "Eat one every day to keep the doctor away!", 12, 90, 0, 2, 0, 1, 2), 
new product1("2", "Grr2", "Guacamole anyone?", 16, 90, 0, 1, 1, 1, 2) 
]; 

this.products = [ 
    new product("APL", "Apple", "Eat one every day to keep the doctor away!", 12, 90, 0, 2, 0, 1, 2), 
    new product("AVC", "Avocado", "Guacamole anyone?", 16, 90, 0, 1, 1, 1, 2), 
    new product("BAN", "Banana", "These are rich in Potassium and easy to peel.", 4, 120, 0, 2, 1, 2, 2) 
]; 

} 



store.prototype.getProduct1 = function (id) { 
    for (var i = 0; i < this.products1.length; i++) { 
     if (this.products1[i].id == id) 
      return this.products1[i]; 
    } 
    return null; 
} 

store.prototype.getProduct = function (sku) { 
for (var i = 0; i < this.products.length; i++) { 
    if (this.products[i].sku == sku) 
     return this.products[i]; 
} 
return null; 
} 

产物。 js

function product(sku, name, description, price, cal, carot, vitc, folate, potassium, fiber) { 
this.sku = sku; // product code (SKU = stock keeping unit) 
this.name = name; 
this.description = description; 
this.price = price; 
this.cal = cal; 
} 

function product1(id, name, desc, price, color, type, category, photo) { 
this.id = id; // product code (id = stock keeping unit) 
this.name = name; 
this.desc = desc; 
this.price = price; 
this.color = color; 
this.type=type; 
this.category=category; 
this.photo=photo; 
} 

我在哪里卡住是，如果我决定使用JSON文件说这句话

$http.get('data/sample.json').success(function(data) { 
    var mydata = JSON.parse(data); 
    store.products1 = mydata; 
    console.log(data); 
}); 

在我的控制器代码和我所得到的控制台上

是数组[对象，对象...]分别与当我在浏览器中查看我的开发工具时，具有值的对象。当我尝试在我的服务功能添加上面的代码即store.js我得到的HTTP没有定义如何更改代码，使产品1从JSON文件保存的值

Answer 1

如果你想获得你的数据json文件夹不要使用$http。 $http适用于服务。你可以用$resource来完成。

var tempCall : $resource('data/sample.json'); 
var query = {}; 
tempCall.get(query, 
    function(response){ 
     var mydata = JSON.parse(response); 
     store.products1 = mydata; 
     console.log(response); 
    }, 
    function(error){ 

    } 
);