1

我一直在关注 Angular 教程，我试图让我的 JSON 数据出现，但我知道我做错了什么，但无法找出正确的方法。

我知道app.js我范围内的某个地方搞砸了。

如何显示Family Name每个产品的？

这是我的布局：

应用程序.js

var eloApp = angular.module('eloMicrosite', []);

eloApp.controller('homeListController', ['$scope', '$http',
    function($scope, $http) {
        $http.get('/Elo/eloMS.min.json')
            .success(function(data) {
                $scope.products = data;
            });
}]);

eloApp.controller('HomeController', function(){
    this.products = $scope.products;
});

HTML

<div ng-controller="HomeController as home">
        {{home.products[o]["Family Name"]}}
</div>

JSON 布局

{
  "products": [
    {
      "Family Name": "3201L",
      "Type": "IDS",
      "Size (inches)": 32,
      "Aspect Ratio": "16:9",
      "Part Number": "E415988",
      "Product Description": "ET3201L-8UWA-0-MT-GY-G",
      "Marketing Description": "3201L 32-inch wide LCD  Monitor",
      "Advance Unit Replacement": "",
      "Elo Elite": "",
      "Package Quantity": 1,
      "Minimum Order Quantity": 1,
      "List Price": 1800
    },
    .
    .
    .
  ],
  "families": [
     {
       category: "Category1"
     },
     {
       category: "Category2"
     }
  ],
  "accessories": [
     {
       category: "Category1"
     },
     {
       category: "Category2"
     }
  ]
}
4

1 回答 1

4

你应该homeListController在你的页面上添加而不是HomeController，还需要使用this而不是使用$scope你想要遵循的controllerAs语法，第二个控制器在这种情况下是无用的，你可以从app.js.

标记

<div ng-controller="homeListController as home">
        {{home.products[0]["Family Name"]}}
</div>

控制器

eloApp.controller('homeListController', ['$http',
    function($http) {
        var home = this;
        $http.get('/Elo/eloMS.min.json')
            .success(function(data) {
                home.products = data.products; //products should mapped here
            });
}]);

演示 Plunkr

于 2015-09-24T19:49:32.437 回答