[英]using geojson data with AngularJS expandable ui-grid
我正在使用Angular JS的ui-grid來顯示一些json(特別是geojson)信息。 我正在使用可擴展網格來列出額外的元數據。 我正在使用的json是這樣的設置:
{
"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-grid 可擴展網格示例使用此json ,它是密鑰對對象的數組,而我的只是具有子屬性的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;
});
為了使網格顯示對象的嵌套屬性,您需要向對象添加一個函數,然后在field參數中調用此函數。
例如,假設您的對象名稱是數據,您將執行
data.getQuadName = function(){
return this.features.properties.QUAD_NAME;
}
然后在您的subGridOptions中
{
name:'QUAD_NAME,
field: 'getQuadName()'
}
讓我知道您是否希望我的回答更加冗長,但我認為這很簡單:)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.