AdvancedDataGrid 能否自动检测 AdvancedDataGridColumnGroup

Question

我正在尝试此链接中的示例：Adobe Flex 4 * Creating column groups

数据是

import mx.collections.ArrayCollection;
            [Bindable]
            private var dpHierarchy:ArrayCollection = new ArrayCollection([
                {Region:"Southwest", Territory:"Arizona", 
                    Territory_Rep:"Barbara Jennings", 
                    Revenues:{Actual:38865, Estimate:40000}}, 
                {Region:"Southwest", Territory:"Arizona", 
                    Territory_Rep:"Dana Binn", 
                    Revenues:{Actual:29885, Estimate:30000}},  
                {Region:"Southwest", Territory:"Central California", 
                    Territory_Rep:"Joe Smith", 
                    Revenues:{Actual:29134, Estimate:30000}},  
                {Region:"Southwest", Territory:"Nevada", 
                    Territory_Rep:"Bethany Pittman", 
                    Revenues:{Actual:52888, Estimate:45000}},  
                {Region:"Southwest", Territory:"Northern California", 
                    Territory_Rep:"Lauren Ipsum", 
                    Revenues:{Actual:38805, Estimate:40000}}, 
                {Region:"Southwest", Territory:"Northern California", 
                    Territory_Rep:"T.R. Smith", 
                    Revenues:{Actual:55498, Estimate:40000}},  
                {Region:"Southwest", Territory:"Southern California", 
                    Territory_Rep:"Alice Treu", 
                    Revenues:{Actual:44985, Estimate:45000}}, 
                {Region:"Southwest", Territory:"Southern California", 
                    Territory_Rep:"Jane Grove", 
                    Revenues:{Actual:44913, Estimate:45000}}
            ]);


<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            // Import the data used by the AdvancedDataGrid control. 
            include "SimpleFlatData.as";
        ]]>
    </fx:Script>

    <mx:AdvancedDataGrid id="myADG"
        dataProvider="{dpFlat}"
        width="100%" height="100%">
        <mx:groupedColumns>
            <mx:AdvancedDataGridColumn dataField="Region"/>
            <mx:AdvancedDataGridColumn dataField="Territory"/>
            <mx:AdvancedDataGridColumn dataField="Territory_Rep"
                headerText="Territory Rep"/>
            <mx:AdvancedDataGridColumnGroup headerText="Revenues">    
                <mx:AdvancedDataGridColumn dataField="Actual"/>
                <mx:AdvancedDataGridColumn dataField="Estimate"/>
            </mx:AdvancedDataGridColumnGroup>    
        </mx:groupedColumns>
   </mx:AdvancedDataGrid>
</s:Application>

在这里，我们必须定义AdvancedDataGridColumnGroup 来定义分组列。

我正在尝试 AdvancedDataGrid 是否可以根据 JSON 数据自动检测列。我尝试使用以下代码：

<mx:AdvancedDataGrid id="inboxDg"
    designViewDataType="flat"
    editable="true"
    dataProvider="{dpHierarchy}"
    width="100%" height="100%">

</mx:AdvancedDataGrid>

使用此代码，AdvancedDataGrid 会自动检测列名和数据。但它无法为Revenues 创建嵌套列。理想情况下，它应该为其创建 2 个子列，分别为 Actual 和 Estimate，但它只创建了一列，并且显示数据为 [object Object]

有没有办法让 AdvancedDataGrid 自动创建嵌套列？

Answer 1

您的数据不是扁平的，仅仅因为您将其放在一个组中并不意味着它将对其进行分组。 dataField 属性不能在其中使用点表示法，因此您有 2 个选项，使用 labelFunction 属性或创建平面数据模型（我个人更喜欢后者）。

为此：

private var dpHierarchy:ArrayCollection = new ArrayCollection([
                {Region:"Southwest", Territory:"Arizona", 
                    Territory_Rep:"Barbara Jennings", 
                    ActualRevenue:38865,
                    EstimateRevenue:40000}, 
                {Region:"Southwest", Territory:"Arizona", 
                    Territory_Rep:"Dana Binn", 
                    ActualRevenue:38865,
                    EstimateRevenue:40000},  
                {Region:"Southwest", Territory:"Central California", 
                    Territory_Rep:"Joe Smith", 
                    ActualRevenue:38865,
                    EstimateRevenue:40000},  
               etc....
            ]);

然后是你的网格：

<mx:AdvancedDataGrid id="myADG"
        dataProvider="{dpFlat}"
        width="100%" height="100%">
        <mx:groupedColumns>
            <mx:AdvancedDataGridColumn dataField="Region"/>
            <mx:AdvancedDataGridColumn dataField="Territory"/>
            <mx:AdvancedDataGridColumn dataField="Territory_Rep"
                headerText="Territory Rep"/>
            <mx:AdvancedDataGridColumnGroup headerText="Revenues">    
                <mx:AdvancedDataGridColumn dataField="ActualRevenue"/>
                <mx:AdvancedDataGridColumn dataField="EstimateRevenue"/>
            </mx:AdvancedDataGridColumnGroup>    
        </mx:groupedColumns>
   </mx:AdvancedDataGrid>

如果您愿意，也可以使用 labelFunction 进行查找，但这似乎比实际需要的要复杂。最后，我觉得我应该注意，您应该在列上手动设置标签属性并遵守数据的编码标准（camelCase）。它只是让事情变得更干净:)