I am attempting to create a list based on heirarchical data, but I am struggling with the syntax to determine if there are children and how to reference and display them under a parent. I can do this with XML data(thanks to example from Alex Hauri), but I need to use an ArrayCollection.

   private var dpHierarchy:ArrayCollection = new ArrayCollection([

    {Region:"Southwest", children: [

     {Region:"Arizona", children: [

      {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},

      {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]}, 

     {Region:"Central California", children: [

      {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]}, 

     {Region:"Nevada", children: [

      {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]}, 

     {Region:"Northern California", children: [

      {Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000},

      {Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000}]}, 

     {Region:"Southern California", children: [

      {Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000},

      {Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000}]}

    ]},

    {Region:"Northwest", children: [

     {Region:"Washington", children: [

      {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},

      {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]}, 

     {Region:"Oregon", children: [

      {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]}, 

     {Region:"Idaho", children: [

      {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]}, 

    ]}

   ]);

List:

<s:List width="400" top="53" left="0" bottom="84" id="lstChartList" dataProvider="{dpHierarchy}" labelField="Region">

  <s:itemRenderer>

   <fx:Component>

    <s:ItemRenderer dataChange="update()">

      <fx:Script>

      import spark.components.List;

      private function update():void

      {

       trace (List(owner).dataProvider[0].children);

     }

     </fx:Script>

     <s:layout>

      <s:HorizontalLayout />

     </s:layout>

     <s:Group id="spacer" />

     <s:Label id="labelDisplay" />

    </s:ItemRenderer>

   </fx:Component>

  </s:itemRenderer>

</s:List>