Javascript 为AngularJS Web应用导入JSON数据

我一直在遵循Angular教程，我试图让我的JSON数据显示出来，但我知道我做错了什么，但无法找到正确的方法

我知道在我的

app.js

中的某个地方，我的范围乱七八糟

如何显示每个产品的

系列名称

以下是我的布局：

app.js HTML

---

您应该在页面上添加

homeListController

，而不是

HomeController

，还需要使用

this

而不是使用

$scope

，因为您希望遵循

controllerAs

语法，第二个控制器在这种情况下是无用的，您可以从

app.js

中删除它

标记

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

---

你应该在你的页面上添加

homeListController

而不是

HomeController

，还需要使用

这个
而不是使用
$scope
，因为你想遵循
控制器的语法，第二个控制器在这种情况下是无用的，你可以从
app.js
中删除它

标记

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

第一个控制器的作用域与第二个控制器的作用域不同！尝试将第一个控制器中的代码添加到第二个控制器并删除第一个控制器。第一个控制器中的作用域与第二个控制器中的作用域不同！尝试将第一个控制器中的代码添加到第二个控制器并删除第一个控制器。我这样做了，但是我收到了一个错误-
[$parse:lexerr]
不确定这意味着什么，但我以前也收到过。我打算对那个错误做些研究，但原因可能是什么？@Adjit应该是
home.products[0][“Family Name”]
用
0
替换
o
，啊，我是个白痴。。。不知道我为什么会有一个
o
肯定是打字错误。但是，没有显示没有错误的姓氏。。。我的
{…}}
指向正确的位置吗？@Adjit看一下更新的答案，然后演示plunkr..将澄清问题..如果你错了，基本上你错过了映射产品
home.products=data.products搞定了！谢谢，我指向了错误的JSON文件位置，没有检查控制台。我这样做了，但是我得到了一个错误-
[$parse:lexerr]
不确定这意味着什么，但我以前也得到过。我打算对那个错误做些研究，但原因可能是什么？@Adjit应该是
home.products[0][“Family Name”]
用
0
替换
o
，啊，我是个白痴。。。不知道我为什么会有一个
o
肯定是打字错误。但是，没有显示没有错误的姓氏。。。我的
{…}}
指向正确的位置吗？@Adjit看一下更新的答案，然后演示plunkr..将澄清问题..如果你错了，基本上你错过了映射产品
home.products=data.products搞定了！谢谢，我指向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"
     }
  ]
}

<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
            });
}]);