title: Flutter ListView Load Data from Nested JSON
body: <p>I've been trying some code from <a href="https://medium.com/flutter-community/parsing-complex-json-in-flutter-747c46655f51" rel="nofollow noreferrer">this</a></p>
  
  <p>I'm trying to load data from local JSON, this JSON is nested model, here's the JSON.</p>
  
  <p><strong><em>list.json</em></strong> :</p>
  
  <pre><code>{
      "response": "200",
      "categorylist": [
          {
              "categoryId": 1,
              "categoryTitle": "Working",
              "categoryPost": [
                  {
                      "postId": 1,
                      "postTitle": "Some Working Title",
                      "reference": "Some Working Reference",
                      "postContent": [
                          {
                              "contentId": 1,
                              "author": "Some Author Name 1",
                              "content": "Some long content long content long content 1",
                              "note": "Some notes 1",
                              "explanation": "Some Explanation 1"
                          },
                          {
                              "contentId": 2,
                              "author": "Some Author Name 2",
                              "content": "Some long content long content long content 2",
                              "note": "Some notes 2",
                              "explanation": "Some Explanation 2"
                          }
                      ]
                  },
                  {
                      "postId": 2,
                      "postTitle": "Some Title 2",
                      "reference": "Some reference 2",
                      "postContent": [
                          {
                              "contentId": 1,
                              "author": "Some Author Name 1",
                              "content": "Some long content long content long content 1",
                              "note": "Some notes 1",
                              "explanation": "Some Explanation 1"
                          },
                          {
                              "contentId": 2,
                              "author": "Some Author Name 2",
                              "content": "Some long content long content long content 2",
                              "note": "Some notes 2",
                              "explanation": "Some Explanation 2"
                          }
                      ]
                  }
              ]
          },
          {
              "categoryId": 2,
              "categoryTitle": "Order",
              "categoryPost": [
                  {
                      "postId": 1,
                      "postTitle": "Some Order Title",
                      "reference": "Some Order Reference",
                      "postContent": [
                          {
                              "contentId": 1,
                              "author": "Some Author Name 1",
                              "content": "Some long content long content long content 1",
                              "note": "Some notes 1",
                              "explanation": "Some Explanation 1"
                          },
                          {
                              "contentId": 2,
                              "author": "Some Author Name 2",
                              "content": "Some long content long content long content 2",
                              "note": "Some notes 2",
                              "explanation": "Some Explanation 2"
                          }
                      ]
                  },
                  {
                      "postId": 2,
                      "postTitle": "Some Title 2",
                      "reference": "Some reference 2",
                      "postContent": [
                          {
                              "contentId": 1,
                              "author": "Some Author Name 1",
                              "content": "Some long content long content long content 1",
                              "note": "Some notes 1",
                              "explanation": "Some Explanation 1"
                          },
                          {
                              "contentId": 2,
                              "author": "Some Author Name 2",
                              "content": "Some long content long content long content 2",
                              "note": "Some notes 2",
                              "explanation": "Some Explanation 2"
                          }
                      ]
                  }
              ]
          }
      ]
  }
  </code></pre>
  
  <p>and here's my <strong><em>list_model.dart</em></strong> :</p>
  
  <pre><code>class Category {
    String response;
    List&lt;Categorylist&gt; categorylist;
  
    Category({this.response, this.categorylist});
  
    Category.fromJson(Map&lt;String, dynamic&gt; json) {
      response = json['response'];
      if (json['categorylist'] != null) {
        categorylist = new List&lt;Categorylist&gt;();
        json['categorylist'].forEach((v) {
          categorylist.add(new Categorylist.fromJson(v));
        });
      }
    }
  
    Map&lt;String, dynamic&gt; toJson() {
      final Map&lt;String, dynamic&gt; data = new Map&lt;String, dynamic&gt;();
      data['response'] = this.response;
      if (this.categorylist != null) {
        data['categorylist'] = this.categorylist.map((v) =&gt; v.toJson()).toList();
      }
      return data;
    }
  }
  
  class Categorylist {
    int categoryId;
    String categoryTitle;
    List&lt;CategoryPost&gt; categoryPost;
  
    Categorylist({this.categoryId, this.categoryTitle, this.categoryPost});
  
    Categorylist.fromJson(Map&lt;String, dynamic&gt; json) {
      categoryId = json['categoryId'];
      categoryTitle = json['categoryTitle'];
      if (json['categoryPost'] != null) {
        categoryPost = new List&lt;CategoryPost&gt;();
        json['categoryPost'].forEach((v) {
          categoryPost.add(new CategoryPost.fromJson(v));
        });
      }
    }
  
    Map&lt;String, dynamic&gt; toJson() {
      final Map&lt;String, dynamic&gt; data = new Map&lt;String, dynamic&gt;();
      data['categoryId'] = this.categoryId;
      data['categoryTitle'] = this.categoryTitle;
      if (this.categoryPost != null) {
        data['categoryPost'] = this.categoryPost.map((v) =&gt; v.toJson()).toList();
      }
      return data;
    }
  }
  
  class CategoryPost {
    int postId;
    String postTitle;
    String reference;
    List&lt;PostContent&gt; postContent;
  
    CategoryPost({this.postId, this.postTitle, this.reference, this.postContent});
  
    CategoryPost.fromJson(Map&lt;String, dynamic&gt; json) {
      postId = json['postId'];
      postTitle = json['postTitle'];
      reference = json['reference'];
      if (json['postContent'] != null) {
        postContent = new List&lt;PostContent&gt;();
        json['postContent'].forEach((v) {
          postContent.add(new PostContent.fromJson(v));
        });
      }
    }
  
    Map&lt;String, dynamic&gt; toJson() {
      final Map&lt;String, dynamic&gt; data = new Map&lt;String, dynamic&gt;();
      data['postId'] = this.postId;
      data['postTitle'] = this.postTitle;
      data['reference'] = this.reference;
      if (this.postContent != null) {
        data['postContent'] = this.postContent.map((v) =&gt; v.toJson()).toList();
      }
      return data;
    }
  }
  
  class PostContent {
    int contentId;
    String author;
    String content;
    String note;
    String explanation;
  
    PostContent(
        {this.contentId, this.author, this.content, this.note, this.explanation});
  
    PostContent.fromJson(Map&lt;String, dynamic&gt; json) {
      contentId = json['contentId'];
      author = json['author'];
      content = json['content'];
      note = json['note'];
      explanation = json['explanation'];
    }
  
    Map&lt;String, dynamic&gt; toJson() {
      final Map&lt;String, dynamic&gt; data = new Map&lt;String, dynamic&gt;();
      data['contentId'] = this.contentId;
      data['author'] = this.author;
      data['content'] = this.content;
      data['note'] = this.note;
      data['explanation'] = this.explanation;
      return data;
    }
  }
  </code></pre>
  
  <p>here's my <strong><em>view_list.dart</em></strong> :</p>
  
  <pre><code>import 'dart:async' show Future;
  import 'dart:convert';
  import 'package:flutter/services.dart' show rootBundle;
  import 'package:flutter/material.dart';
  import 'model.dart';
  
    Future&lt;String&gt;  _loadCategoryfromAssets() async {
      return await rootBundle.loadString('assets/data/list.json');
    }
  
    Future loadCategory() async {
      await wait(1);
      String jsonString = await _loadCategoryfromAssets();
      final jsonResponse = json.decode(jsonString);
      Category category = Category.fromJson(jsonResponse);
      print(category.categorylist[0].categoryTitle);
      print(category.categorylist[0].categoryPost[0].postTitle);    
    }
  
    Future wait(int seconds) {
      return new Future.delayed(Duration(seconds: seconds), () =&gt; {});
    }
  
  class Doa extends StatefulWidget {
    Doa({Key key}) : super(key: key);
  
    _DoaState createState() =&gt; _DoaState();
  }
  
  class _DoaState extends State&lt;Doa&gt; {
  
    Widget futureWidget() {
      return new FutureBuilder(
        future: loadCategory(),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            return new Container(
              child: Row(
                children: &lt;Widget&gt;[
                  ListView.builder(
                    itemBuilder: (BuildContext context, index) {
                      return Column(
                        children: &lt;Widget&gt;[
                        InkWell(
                          onTap: () {},
                          child: Text(
                            snapshot.data.category.categorylist[index].categoryTitle,
                          ),
                        )
  
                        ],
                      );
                    }
                  )
                ],
              ),
            );
          } 
        },
      );
    }
  
    @override
    Widget build(BuildContext context) {
      return SafeArea(
          top: false,
          bottom: false,
          child: Scaffold(
          body: futureWidget(),
          ));
    }
  }
  </code></pre>
  
  <p>I'm stuck load the data from JSON inside categorylist into listview.builder.</p>
  
  <p>in the view code above, I'm only want to list all "categoryTitle" from json, with ontap action to detail page. how to do that ?</p>