How to get name of json object with angular

Question

I am trying to get name of json object (bdev0, and bdev1 in this case) from my dataset.

So far I have tried ng-options with no success. What I am trying to achieve in the following code is just to retrieve the name of json object. So far all the examples I have tried did not work for my case.

jsfiddle

Code:

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

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.data = [{
        "Block_Devices": {
            "bdev0": {
                "Backend_Device_Path": "/dev/ram1",
                "Capacity": "16777216",
                "Bytes_Written": 1577,
                "timestamp": "4365093970",
                "IO_Operations": 17757,
                "Guest_Device_Name": "vdb",
                "Bytes_Read": 17793,
                "Guest_IP_Address": "192.168.26.88"
            },
            "bdev1": {
                "Backend_Device_Path": "/dev/ram2",
                "Capacity": "16777216",
                "Bytes_Written": 1975,
                "timestamp": "9365093970",
                "IO_Operations": 21380,
                "Guest_Device_Name": "vdb",
                "Bytes_Read": 20424,
                "Guest_IP_Address": "192.168.26.100"
            }
        },
        "Number of Devices": 2
    }]

}

HTML

<div ng-controller="MyCtrl">
  <select name="Block_Devices" ng-model="selectedDevice"  ng-options="value.Block_Devices for value in data">
  <option value="">Please Select Device</option>
    </select>
</div>
Selected Device = {{selectedDevice}}

Bon Macalindong · Accepted Answer · 2016-05-11 10:11:02Z

1

You may use the ng-repeat="(key, value) in array" syntax.

<div ng-repeat="(key, value) in data[0].Block_Devices">
{{key}}
</div>

{{key}} will be the property of Block_Devices
See sample jsfiddle

edited May 11, 2016 at 10:11

answered May 11, 2016 at 10:05

Bon Macalindong

1,32013 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nils Over a year ago

ng-options="key for (key, value) in data[0].Block_Devices" will work in select

Nils · Accepted Answer · 2016-05-11 10:13:35Z

1

As Bon stated before me you can do as in this jsfiddle

  <select name="Block_Devices" ng-model="selectedDevice.Bytes_Written" ng-options="key for (key, value) in data[0].Block_Devices">
    <option value="">Please Select Device</option>
  </select>

answered May 11, 2016 at 10:13

Nils

9871 gold badge10 silver badges20 bronze badges

Collectives™ on Stack Overflow

How to get name of json object with angular

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related