Access JSON array value from other array – flutter

Issue

What I’m trying to do is that if someone opens part 1 (JSON), then their respective article should be visible on the next screen. I was able to list out all the parts but how to show their respective articles on the next screen. For example, the first part contains 3 articles and the second part would contain 3

basically, every part would contain a different number of articles.

JSON

[
  [ // Article Names
    {
      "ArtNo": "0",
      "Name": "PREAMBLE",
    },
    {
      "ArtNo": "1",
      "Name": "Name and territory of the Union.",
    },
    {
      "ArtNo": "2",
      "Name": "Admission or establishment of new States.",
    },
    {
      "ArtNo": "3",
      "Name": "Formation of new States and alteration of areas, boundaries or names of existing States.",
    },
    {
      "ArtNo": "4",
      "Name": "Laws made under articles 2 and 3 to provide for the amendment of the First and the Fourth Schedules and supplemental, incidental and consequential matters.",
    },
    {
      "ArtNo": "5",
      "Name": "Citizenship at the commencement of the Constitution."
    }
  ],
  [ // Article Parts
    {
      "PartNo": "I",
      "Name": "THE UNION AND ITS TERRITORY",
      "Articles": ["1", "2", "3"]
    },
    {
      "PartNo": "II",
      "Name": "CITIZENSHIP",
      "Articles": ["4", "5"]
    }
  ]
]

Flutter (list out all parts)

class _ConstitutionPartsState extends State<ConstitutionParts> {


  Future parts() async {
    final data = await rootBundle.loadString('assets/json/file.json');
    final jsonResult = jsonDecode(data);
    final parts = jsonResult[1];
    return parts;
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder(
          future: parts(), builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
            if(snapshot.connectionState == ConnectionState.waiting){
              return const CircularProgressIndicator(color: Colors.deepOrangeAccent);
            }
            return Container(
              margin: const EdgeInsets.all(25.0),
              child: ListView.builder(
                  itemCount: snapshot.data.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Container(
                      margin: const EdgeInsets.only(bottom: 20.0),
                      child: ListTile(
                         title: Text(snapshot.data[index]['Name']),
                      ),
                    );
                    },
              ),
            );
            },
      ),
    );
  }
}

any help would be appreciated! thank you

Solution

You can use where condition for filteration,
more info

Here’s the Full Code

class _ConstitutionPartsState extends State<ConstitutionParts> {


  Future parts() async {
    final data = await rootBundle.loadString('assets/json/file.json');
    final jsonResult = jsonDecode(data);
    return jsonResult; // return whole json
    
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder(
          future: parts(), builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
            if(snapshot.connectionState == ConnectionState.waiting){
              return const CircularProgressIndicator(color: Colors.deepOrangeAccent);
            }
            return Container(
              margin: const EdgeInsets.all(25.0),
              child: ListView.builder(
                  itemCount: snapshot.data[1].length,
                  itemBuilder: (BuildContext context, int index) {
                    return Container(
                      margin: const EdgeInsets.only(bottom: 20.0),
                      child: ListTile(
                         title: Text(snapshot.data[index]['Name']),
                         onTap():{
                             //navigate to name page with 
                             NewPage(articePartIndex : index, json: snapshot.data)
}
                      ),
                    );
                    },
              ),
            );
            },
      ),
    );
  }
}

NewPage {
final List<List<dynamic>> json;
final int index;
@override
  Widget build(BuildContext context) {
var articles = json[1][index]['Articles'];
var filteredArticleList = json[0].where((a) => articles.contains(a['ArtNo'])).toList();
return ListView.builder(
                  itemCount: snapshot.data.length,
                  itemBuilder: (BuildContext context, int index) {
                            return ListTile(
                         title: Text(filteredArticleList[index]['Name']),
                      ),
});
}
}

Answered By – Sahil Hariyani

Answer Checked By – Pedro (FlutterFixes Volunteer)