如何使用 angular JS 访问 JSON 中的嵌套对象

Question

这是我的 JSON 数据的格式：

[

 {

 "Department_id": "34",

 "Names": [

     "Jack Jones",

     "Matt Jones",

     "Lynn Lewis"

  ],

  "Employee-num": 3,

  "Salary-info": {

      "Jack Jones": 1000,

      "Matt Jones": 2920,

      "Lynn Lewis": 1500

    },

 },

]

如何获得 "salary-info"？并显示如下：

Jack Jones: 1000

Matt Jones: 2920

Lynn Lewis: 1500

在 jade 上，我尝试使用

访问它

p(ng-repeat='details in info.salary-info') {{ details }}

但是它不起作用，它只在屏幕上显示一个“0”。

info.Department_id 用于显示 34 的部门 ID。

问题已解决

没有显示的问题是因为对象名称中存在连字符。

您需要使用“[”带连字符的对象名称“]”访问此类对象，

赞：{{信息["salary-info"]}}

而不是 {{ info.salary-info }}。

希望对遇到同样问题的人有所帮助。

Answer 1

对象的 ngRepeat 语法是 (k, v) in obj - 所以你可以这样做：

p(ng-repeat='(name, salary) in info.salary-info') {{ name }} : {{salary}}

Answer 2

您可以像这样从对象中获取键和值：

<span ng-repeat="(name, salary) in info['Salary-info']">{{name}} : {{salary}}</span>

https://docs.angularjs.org/api/ng/directive/ngRepeat#iterating-over-object-properties

Answer 3

问题是 Salary-info 中的连字符。有关演示，请参阅此 plunker.

index.html

<!-- Jack Jones: 1000 Matt Jones: 2920 Lynn Lewis: 1500 -->
<p ng-repeat="name in details.Names">
  {{name}}: {{details['Salary-info'][name]}}
</p> <!-- works -->

or

<p ng-repeat="(name, salary) in details['Salary-info']">
  {{name}}: {{salary}}
</p> <!-- works-->

or

<p ng-repeat="(name, salary) in details2.SalaryInfo">
  {{name}}: {{salary}}
</p> <!-- works -->

一切正常，但是

<p ng-repeat="(name, salary) in details.Salary-info">
  {{name}}: {{salary}}
</p> <!-- fails!-->

失败。

数据

app.js

app.controller('MainCtrl', function($scope) {
  $scope.details =
      ...
        "Salary-info": {"Jack Jones": 1000, "Matt Jones": 2920, "Lynn Lewis": 1500},
      ...

  $scope.details2 =
      ...
      "SalaryInfo": {"Jack Jones": 1000, "Matt Jones": 2920, "Lynn Lewis": 1500},
      ...

如何使用 angular JS 访问 JSON 中的嵌套对象

How to access nested objects in JSON using angular JS

javascript

json

angularjs

pug

数据