javascript - 将项目从 JSON 对象推送到 Angular js 中的下拉列表

标签 javascript jquery angularjs json

我有一个 json 文件作为

var myJson = {
   "Number of Devices":2,
   "Block Devices":{
      "bdev0":{
         "Backend_Device_Path":"/dev/ram1",
         "Capacity":"16777216",
         "Bytes_Written":9848,
         "timestamp":"4365093970",
         "IO_Operations":87204,
         "Guest_Device_Name":"vdb",
         "Bytes_Read":107619,
         "Guest_IP_Address":"192.168.26.88"
      },
      "bdev1":{
         "Backend_Device_Path":"/dev/ram2",
         "Capacity":"16777216",
         "Bytes_Written":10062,
         "timestamp":"9365093970",
         "IO_Operations":93789,
         "Guest_Device_Name":"vdb",
         "Bytes_Read":116524,
         "Guest_IP_Address":"192.168.26.100"
      }
   }
}

我想在下拉菜单中推送 block 设备的名称。在查看了一些示例后,名称为 bdev0 和 bdev1 我尝试了以下代码,但我只是在下拉列表中返回 [Object object]

查看

<select ng-model="selectedDevice" ng-options="item as devices['Block Devices'] for item in selectdevice">
    <option value="">Select Device</option>
   </select>

和 Controller

    .controller('timeSeriesCtrl', function($scope, $timeout, $http) {

    $scope.selectedDevice = null;
    $scope.selectdevice = [];
    $scope.bytesRead = [];
    $scope.bytesWritten = [];
    $scope.IoOps = [];
    $scope.currentTime = [];
    var path = 'http://orbit5.ds.cs.umu.se:8888/vrio/debug/blk'


function getData(){
  $http.get(path)
  .success(function(data){
    $scope.devices = data
    angular.forEach($scope.devices['Block Devices'], function(value, key){

           $scope.selectdevice = key;
})


  })
}

getData();





  });

最佳答案

删除forEach 的所有代码,只使用(key,value) 语法ng-options

function getData(){
  $http.get(path)
  .success(function(data){
    $scope.devices = data
    //angular.forEach($scope.devices['Block Devices'], function(value, key){
       //$scope.selectdevice = key;
    //   value.key = key;
    //})
  });

在 html 中:

<select ng-model="selectedDevice" 
      ng-options="item as key  for (key,item) in devices['Block Devices'] ">
    <option value="">Select Device</option>
</select>

fiddle :https://jsfiddle.net/ncapito/4mqFJ/6/

关于javascript - 将项目从 JSON 对象推送到 Angular js 中的下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35316327/

相关文章:

调色板生成器的 javascript 源代码

javascript - 防止在 ui-router 中重新加载父 Controller

javascript - 单击图像时接收(不需要的)mousemove 事件

javascript - 关键字 this 没有给我当前对象,只有它的父对象。我如何获得当前对象?

javascript - LESS 如何在达到 100% 时更改进度条背景颜色

javascript - 如何清除 span 的 innerHTML

javascript - 使用 jquery 在页面后加载广告(脚本)

javascript - 如何选择没有第一个图像的所有图像?

html - IE8 问题 : AngularJS ng-include - partials with HTML5 node structure

javascript - Angular js - 使用延迟加载从 View 中需要 js 文件