如何使用ng-repeat从嵌套的json对象中检索数据

时间:2016-02-07 11:45:22

标签: javascript angularjs json

我正在尝试使用ng-repeat从下面提到的JSON对象中检索EmpName。

我的js文件:

$scope.items = [];
        $scope.allItems = [{

        "categoryId": 1,
        "categoryName": "abc",
        "Employee": [{
            "EmpId": 1,
            "EmpName": "Raj",
            "EmpJob": "Accounts",
            "DataList": [{
                "year": "Oct-2015",
                "salary": "244"
            },
            {
                "year": "Jul-2015",
                "salary": "100"
            },
            {
                "year": "Jun-2015",
                "salary": "117"
            }]
        }]
    },
    {
        "categoryId": 2,
        "categoryName": "xyz",
        "Employee": [{
            "EmpId": 2,
            "EmpNameName": "Sita",
            "EmpJob": "Software Engineer",
            "DataList": [{
                "year": "Oct-2015",
                "salary": "244"
            },
            {
                "year": "Jul-2015",
                "salary": "100"
            },
            {
                "year": "Jun-2015",
                "salary": "117"
            }]
        }]
    }]
}]

我的HTML:

<div id="Div1" ng-repeat="item in allItems">
  <div id="Div2" >
     <div id="Div3">
       <font color="white">{{item.EmpName}}</font>
     </div>
  </div>
</div>

这里我将allItems推送到items数组中。然后我如何从items数组中检索EmpName。任何人都可以帮我解决这个问题......

2 个答案:

答案 0 :(得分:1)

你可以做点什么 每个项目都包含Employee Array,只有一个Employee对象。因此,您可以从员工列表中获取第一项,然后获取它的EmplyeeName

 <div id="Div1" ng-repeat="item in items" >
     <div id="Div2" >
          <div id="Div3"><font color="white">{{item.Employee[0].EmpName}}</font>                  </div>
  </div>

答案 1 :(得分:0)

根据$scope.allItems数组,每个项目都有Employee属性,该属性也是一个数组:

{
  "categoryId": 1,
  "categoryName": "abc",
  "Employee": [
    {
      "EmpId": 1,
      "EmpName": "Raj",
      "EmpJob": "Accounts",
      "DataList": [
        {
          "year": "Oct-2015",
          "salary": "244"
        },
        {
          "year": "Jul-2015",
          "salary": "100"
        },
        {
          "year": "Jun-2015",
          "salary": "117"
        }
      ]
    }
  ]
}

此属性只包含一个包含EmpName属性的对象。因此,要获取EmpName属性,您需要通过Employee数组的第一项访问它:

<div id="Div1" ng-repeat="item in allItems">
  <div id="Div2" >
     <div id="Div3">
       <font color="white">{{item.Employee[0].EmpName}}</font>
     </div>
  </div>
</div>