Angular ng-repeat列出具有未知属性名称的对象中的所有项目

时间:2014-06-17 02:05:26

标签: angularjs angularjs-ng-repeat

我对(真正的)javascript很新,对Angular来说是新手

我正在为家庭自动化编写应用程序。该应用程序返回一个设备列表,然后当您单击设备时,它会通过JSON返回它的详细信息(如下例所示)。我遇到的问题是不同的设备类型在对象中返回不同的名称值对,我赢了;事先知道这些。 (例如,灯开关将返回调光水平,但恒温器会返回传感器水平。

显然,我的应用程序只能处理具有已知属性的内容(例如设置昏暗级别,如果它是一个灯光),但用户可能希望查看所有属性。他们是否可以使用ng-repeat列出所有名称值对而不知道属性名称?

示例:

 {
    "name": "1-Wire Test1",
    "address": 0,
    "addressStr": "unknown",
    "classID": 3,
    "devProtocol": 999,
    "displayInUI": true,
    "displayLongState": "76.7 °F",
    "displayRawState": "76.700000",
    "folderID": 1418405935,
    "hasStateToDisplay": true,
    "id": 704024169,
    "lastChanged": 456266814,
    "lastChangedDateStr": "2014-06-16",
    "lastChangedRFC3339": "2014-06-17T01:46:54Z",
    "lastChangedRFC822": "Tue, 17 Jun 2014 01:46:54 GMT",
    "lastChangedTimeStr": "08:46:54 PM",
    "sensorValue": "76.7 °F",
    "type": "1-Wire Temperature Sensor",
    "typeFlags": 81,
    "typeSupportsDim": false,
    "typeSupportsEnergyMeter": false,
    "typeSupportsHVAC": false,
    "typeSupportsIO": false,
    "typeSupportsOnOff": false,
    "typeSupportsSensorValue": true,
    "typeSupportsSpeedControl": false,
    "typeSupportsSprinkler": false,
    "versByte": 0,
    "restParent": "devices"
}

2 个答案:

答案 0 :(得分:13)

当然,请使用(k, v) in o重复语法:

例如:

<span ng-repeat="(property, value) in phoneProperties">{{property}} : {{value}}</span>

答案 1 :(得分:2)

var anObject = {randomName: "foo",
                randomNameNumber100: "bar"};

在模板中

<div ng-repeat="(key, val) in anObject">
  <p>{{ key }}</p>
  <p>{{ val }}</p>
</div>

这将根据键以排序的方式显示您的对象。