Home App Docs Github

Data Binding Multi-Dimensional Arrays

I am having some difficulties trying to data bind an array element inside another array. Is this possible? I feel like this is common.

I am using a fetch to hit my API inside the “Data -> Edit JS + CSS” feature. I am successfully capturing the response.

Sample Response

{
  user: {
    name: Blake,
    nickname: Bull
  },
  favorites: [
    {
      id: 1,
      name: colors,
      items: [
        {
          id: 3820,
          name: red
        },
        {
          id: 3821,
          name: blue
        }
      ]
    }
  ]
}

How can I loop and data bind to favorites.items … to display values Red and Blue ?

Builder provides number of helpful properties on it’s state for each block in a repeat, so if you’re doing a repeat on a state.results , you’ll get under it , $resultsItem , and $resultsIndex and those will be available for any repeat under that.
I created a fiddle that loops through an array of arrays, to inspect the object you can see it in the data tag > edit content JS + CSS (scroll till the end)

If you want to see how’s the repeats happening, please go through the layers in the layers tab, and you’ll see a repeat icon, that you can click and see what is being repeated for that layer.

Marked as solved!

First loop will repeat on state.favorites
Second loop will repeat on state.favoritesItem.items … state.favoritesItem is set from first loop.

Thank you

1 Like