0
ng-repeatには少し問題があります。
私は表示しようとしているデータがどこにjsonファイルがあります。
私はデータを共有するための小さなサービスを書いた。それは情報を設定して取得するいくつかのメソッドを持っていますが、私のコントローラでそのメソッドを使用して結果を変数(私が反復しようとしているもの)に格納しようとすると、isは空のようですが、変数を出力し、結果を出力します。
ここに私のアプローチ。
ng-repeatは反復していません
HTML
<ul class="list-unstyled products-list">
<li class="col-sm-6 col-md-3 product" ng-repeat="product in products">
<article>
<img ng-src="{{ product.img }}" class="img-responsive" alt="">
<div class="short-product-detail text-center">
<p class="name">{{ product.name }}</p>
<span class="price">{{ product.price }}</span>
</div>
<a href="javascript:void(0);" class="add-to-cart text-center">add to cart</a>
</article>
</li>
</ul>
コントローラ
angular.module("Store")
.controller("ProductsCtrl", ["$scope", "productsService", function ProductsCtrl($scope, productsService) {
$scope.products = [];
productsService.fetchProducts()
.then(function(response) {
productsService.setProducts(response.data.products);
$scope.products = productsService.getProducts();
console.log($scope.products)
})
}])
サービス
angular.module("Store")
.service("productsService", ["api", "$http", function (api, $http) {
var productsList = [];
var categories = [];
var getProducts = function() {
return productsList;
};
var setProducts = function(products) {
productsList.push(products);
};
var getCategories = function() {
return categories;
};
var setCategories = function(categories) {
categories.push(categories);
}
var fetchProducts = function() {
return $http({
method: "GET",
url: api.url
});
}
return {
fetchProducts: fetchProducts,
getProducts: getProducts,
setProducts: setProducts,
getCategories: getCategories,
setCategories: setCategories
}
}])
main.js
angular.module("Store", ["ui.router"])
.constant("api", {
url: "data.json"
})
.config(function config($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
// Set up the states
$stateProvider
.state("products", {
url: "/",
views: {
"": {
templateUrl: "./templates/products.html",
controller: "ProductsCtrl"
}
}
})
})
私が間違っていることを教えてください。
ようにそれを変更します。 '$ scope.products'を印刷すると、私は期待しているがHTMLの結果は表示されません –
@RicardoaprendizfcOrdoezDelgチームビューアはありますか? – Sajeetharan