2014-11-22 48 views
0

我使用Angular JS的ui-grid来显示一些json(特别是geojson)信息。我正在使用可展开的网格来列出额外的元数据。我使用的JSON设置如下:使用geojson数据与AngularJS可扩展ui网格

{ 
"type": "FeatureCollection", 
"totalFeatures": 36, 
"features": [{ 
    "type": "Feature", 
    "id": "someid", 
    "geometry": { 
     "type": "MultiPolygon", 
     "coordinates": [ 
      [ 
       [ 
        [-71.62599996, 41.250999959999994], 
        [-71.49899628, 41.250999959999994], 
        [-71.49899628, 41.12399619], 
        [-71.62599996, 41.12399619], 
        [-71.62599996, 41.250999959999994] 
       ] 
      ] 
     ] 
    }, 
    "geometry_name": "the_geom", 
    "properties": { 
     "QUAD_NAME": "Block Island", 
     "STATE": "RI", 
     "ACQYEAR": "2010", 
     "RESOLUTION": "1 Meter", 
     "FILMTYPE": "Color", 
     "TILE": "sometile", 
     "X1": -71.626, 
     "Y1": 41.124, 
     "X2": -71.499, 
     "Y2": 41.251 
    } 
} 

我想在子网格中显示上面的属性对象。

ui网格expandable grid example使用this json这是一个keypair对象的数组,而mine只是一个带有子属性的JavaScript对象。作为一个新的JavaScript编码器,我不明白我如何告诉ui-grid,而只是查看属性对象的定义,我给它。

下面是相关代码:

$scope.gridOptions = { 
     expandableRowTemplate: 'app/map/expandableRowTemplate.html', 
     expandableRowHeight: 150, 
     enableGridMenu: true, 
     enableRowSelection: true, 
     enableSelectAll: true, 
     selectionRowHeaderWidth: 35, 
     expandableRowScope: { 
      subGridVariable: 'subGridScopeVariable' 
     } 
    }; 

    $scope.gridOptions.columnDefs = [{ 
     name: 'id', 
    }]; 

    $scope.gridOptions.multiSelect = true; 

    $http.get('/assets/rhode.json') 
     .success(function(data) { 
      //var items = data.features; 
      for (var i = 0; i < data.features.length; i++) { 
       data.features[i].subGridOptions = { 
        columnDefs: [{ 
         name: 'QUAD_NAME', 
         //  field: 'QUAD_NAME' 
        }, { 
         field: 'ACQYEAR', 
         //  field: 'ACQYEAR' 
        }], 
        data: data.features[i].properties 
       } 
      } 

      $scope.gridOptions.data = data.features; 
     }); 

回答

0

,以获得电网,以显示你的对象的嵌套属性,你需要的功能添加到您的对象,然后在现场参数,调用这个函数。

例如,假设你的对象的名字是你会怎么做

data.getQuadName = function(){ 
    return this.features.properties.QUAD_NAME; 
} 

,然后在subGridOptions数据,你会做

{ 
    name:'QUAD_NAME, 
    field: 'getQuadName()' 
} 

让我知道如果你要我更详细在我的答案,但我认为这是非常直接:)