Create a list/grid of an array in Firestore

I am trying to make a list/grid of an array of fields in Firestore but I don’t get how to get it done. The array would be the subjects that the student (document) has at the moment:

I have tried to list each one of the items (as a list element does in RS) using the list/grid and then selecting the field in the “Take value from property”:

Then the component to fill out the list would be just a regular text field so I have a list of text items from the array. However, if the text component that I have created to fill out the list does not have any source linked in the data source section, I can see this:

It is pretty clear that it tries to create the list out of the 9 subjects listed in the array, but the text for each one is not correct. So I tried to select in the data source the same property (subjects):

But the result will be not getting any output. It is as if there is no list.

Just for testing, I created a text element using this array in Firestore as a source of text and I can clearly see there the content:

But I would like to display these values like a list or grid. How can I do this?

I have come up with another scenario where the approach would be the same. Create a list/grid from an array. I am guessing that it is something pretty common. Like when there are tags for a post and you want to display these tags in the bottom of the message. I am pretty sure it is in the option that I was selecting and the only thing that I would need is to create script in the data source option but I don’t know how to. I tried to do the forEach and a loop option but I don’t get to achieve it.

I would appreaciate some guidance. Thanks!

It looks like the array contains just list of strings instead of objects. If you look at the generated code you need tl have JSON so you can refer to certain ”field” in the JSON array with the prop name.

Thank you for your answer @Antti_Neonto. I see. I am sorry if I still get a little confused between arrays, JSON, collection of strings, JS objects, etc.

According to your answer I am guessing that I could make it work if, instead of creating an “array” in Firestore (which is like the screenshots that I sent), I should make a “map” in Firestore, which is similar to the arrays but it includes “key”:“value”.

Anyway, I decided to create a subcollection instead of an array because I thought that it will be necessary when it scales a little bit to indicate not just the subjects, but the teacher associated with each subject and some other information. So a few days ago I implemented it as a subcollection instead of an array, and that I know how to get it done.

Thank you so much. Your RS is a great tool not just to create, but it is helping me to learn while I create something :slight_smile:

1 Like