Unable to retrieve some fields from Firestore Database

Question

I am building a restaurant app in which I have used firestore as my backend. I have stored the details of the menu in a collection Menu and each menu item in specific documents. Firstly, is that a good data model, or should I have the whole menu in the same document?

Secondly, the problem is while I retrieve the the collection and the docs, I am not being able to access some fields. If there are 4 documents and all of them contains the field 'Name' and data in the field. But when I fetch the data, parse it inot the list and have the command Menu[index]['Name] only two of the names in the documents are displayed while the other two return null.

class MenuController extends GetxController {
  final CollectionReference _menulsit =
      FirebaseFirestore.instance.collection('Menu');

  Future getmenu() async {
    List Menulist = [];
    try {
      await _menulsit.get().then((QuerySnapshot snapshot) {
        snapshot.docs.forEach((element) {
          Menulist.add(element.data());
        });
      });
      return Menulist;
    } catch (e) {
     
      return null;
    }
  }
}

While I parse it into a list and print the list, the data is retrieved and is printed in the console. There is the field 'Name' printed on the console but when I try to access it from the list it returns null.

I have used the list from the class, made a method, and provided a list here with the data retrieved. I need to use the data in a listview.seperated.

class _FoodmenuState extends State<Foodmenu> {
  List menulist = [];
  @override
  void initState() {
    super.initState();
    fetchmenu();
  }

  Future fetchmenu() async {
    dynamic resultmenu = await MenuController().getmenu();
    if (resultmenu == null) {
      return Text('Unable to retrive data');
    } else {
      setState(() {
        menulist = resultmenu;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Container(
          height: 228,
          child: ListView.separated(
              scrollDirection: Axis.horizontal,
              itemBuilder: ((context, index) => _menucontent(index, menulist)),
              separatorBuilder: ((context, index) {
                return SizedBox(
                  width: 18,
                );
              }),
              itemCount: 1))
    ]);
  }
}

While I print the list there is the field "Name" but I can't access it.

Print(menu)
I/flutter (31598): [{Name: Cheese Burger}, {Name : Buffalo Wings}, {Name : Pasta Bolognese }, {Name : Chicken MoMo}]

Print(menu[1])
I/flutter (31598): {Name : Buffalo Wings}

Print(menu[1]['Name']
I/flutter (31598): null

How can I access every field in my database and run it in my app?

Answer 1

You cannot Access data by key from encoded JSON. Decode JSON data, then add into List.

 await _menulsit.get().then((QuerySnapshot snapshot) {
        snapshot.docs.forEach((element) {
          Menulist.add(jsonDecode(element.data()));
        });
      });