2016-10-16 24 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