title: handling nested JSON data for ListView
body: <p>I am looking to access nested JSON data from a firebase database to use within a <code>listView</code>, this is something I have applied throughout my app, but am now having trouble having to access children of the data with dynamic properties.</p>
  
  <p>An export of my JSON data from my data base is;</p>
  
  <pre><code>{
      "T&amp;G Canary Wharf" : {
          "Administrator" : {
              "1550633367665" : {
                  "date" : "2019-02-12T12:00:00.000",
                  "details" : "Full Day",
                  "name" : "Edward Lawrence",
                  "status" : "pending"
              },
              "1550633370715" : {
                  "date" : "2019-02-13T12:00:00.000",
                  "details" : "Full Day",
                  "name" : "Edward Lawrence",
                  "status" : false
              },
              "1550845072137" : {
                  "date" : "2019-02-12T12:00:00.000",
                  "details" : "Full Day",
                  "name" : "Katie Prescott ",
                  "status" : 1
              },
          },
          "Stylist" : {
              "1551222170677" : {
              "date" : "2019-02-19T12:00:00.000",
              "details" : "Full Day",
              "name" : "Stylist Stylist",
              "status" : "pending"
        }
      }
    }
  }
  </code></pre>
  
  <p>Per user of the app, <code>group</code> (in the above example T&amp;G Canary Wharf) will always be set, but the <code>subgroup</code> (in the example Administrator &amp; Stylists) is dynamic for admins, and this is where I am struggling,</p>
  
  <p>My code for my firebase database read is below:</p>
  
  <p>I am using felgo(formerly v-play), a link to their firebase documentation is:</p>
  
  <p><a href="https://felgo.com/doc/plugin-firebase/" rel="nofollow noreferrer">Felgo Firebase Plugin</a></p>
  
  <pre><code>App {
  
      property var adminModel: []
      property var groupName //the group name is assigned onLoggedIn, in this example group name === T&amp;G Canary Wharf
  
      FirebaseDatabase {
          onLoggedIn: { 
          firebaseDb.getValue("groups" + "/" + groupName, {
                                  orderByValue: true
                              }, function(success, key, value) {
                              if(success){
                              console.log("ADMIN MODEL: " + JSON.stringify(value))
                              adminModel = value // my array where I intend to push the data too                              
                              }
                          })
                      }
                  }
              }
  </code></pre>
  
  <p>I have been reading through;</p>
  
  <p><a href="https://stackoverflow.com/questions/11922383/access-process-nested-objects-arrays-or-json">access/process nested objects, arrays or JSON</a></p>
  
  <p>(super helpful by the way) specifically the section of 
  <strong>What if the property names are dynamic and I don't know them beforehand?</strong></p>
  
  <p>I can create two list entries, of <code>Administrator</code> and <code>Stylist</code> (the subGroups, but where the child key of this is also dynamic (the time the entry is created, e.g: "1550633367665"), I cannot seem to get further?</p>
  
  <p>to create this model I have the code: </p>
  
  <pre><code>ListPage {
      id: adminPage
  
      model: Object.keys(adminModel)
  
  delegate: SwipeOptionsContainer {
      id: container
  
      rightOption:  SwipeButton {
          anchors.fill: parent
          backgroundColor: "red"
          icon: IconType.trash
  
          onClicked: {
              container.hideOptions()
          }
      }
  
      SimpleRow {
          id: userRow
          width: parent.width
          text: modelData
          }
      }
  }
  </code></pre>
  
  <p><strong>My question is</strong></p>
  
  <p>How can I create a <code>listView</code>  with the delegates being any object containing a <code>"status" : "pending"</code> - done in other areas using a loop of <code>if (value[i].status === pending) { arr.push({...})}</code>, but whilst the <code>subgroup (Stylist/Administrator)</code> is unknown, from the above database example there would be 2 list elements, but in reality will contain many more with multiple <code>subGroup</code>'s.</p>