2016-10-16 80 views
0

我有一个ng-repeat的小问题。
我有一个json文件,其中是我试图显示的数据。
我写了一点点服务来分享数据。它有一些方法来设置和获取信息,但是,当我尝试在我的控制器中使用该方法将结果存储在一个变量(我试图迭代的变量)中时,它就像是空的,但是当我打印变量,打印结果。
这是我的方法。
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" 
        } 
       } 
      }) 
    }) 

请让我知道我做错了什么。
在此先感谢球员

回答

1

问题是你的配置,改变它,这样

$stateProvider 
    .state('products', { 
    url: '/products', 
    templateUrl: './templates/products.html', 
    controller: 'ProductsCtrl' 
    }) 
+0

我改变了它,但问题仍然存在。 事情是当我打印'$ scope.products'打印我期待的结果,但不是为HTML –

+0

@RicardoaprendizfcOrdoezDelg你有团队查看器吗? – Sajeetharan