Parsing JSON that has a nested array of objects in Dart?

Question

I am making a Flutter app and I am using The MovieDB api to get data. When I call the api and ask for a specific movie, this is the general format that I get back:

{    "adult": false,     "backdrop_path": "/wrqUiMXttHE4UBFMhLHlN601MZh.jpg",     "belongs_to_collection": null,     "budget": 120000000,     "genres": [         {             "id": 28,             "name": "Action"         },         {             "id": 12,             "name": "Adventure"         },         {             "id": 878,             "name": "Science Fiction"         }     ],     "homepage": "http://www.rampagethemovie.com",     "id": 427641,     "imdb_id": "tt2231461",     "original_language": "en",     "original_title": "Rampage", ... } 

I have setup a model class for to parse this and the class is defined as such:

import 'dart:async';  class MovieDetail {   final String title;   final double rating;   final String posterArtUrl;   final backgroundArtUrl;   final List<Genre> genres;   final String overview;   final String tagline;   final int id;    const MovieDetail(       {this.title, this.rating, this.posterArtUrl, this.backgroundArtUrl, this.genres, this.overview, this.tagline, this.id});    MovieDetail.fromJson(Map jsonMap)       : title = jsonMap['title'],         rating = jsonMap['vote_average'].toDouble(),         posterArtUrl = "http://image.tmdb.org/t/p/w342" + jsonMap['backdrop_path'],         backgroundArtUrl = "http://image.tmdb.org/t/p/w500" + jsonMap['poster_path'],         genres = (jsonMap['genres']).map((i) => Genre.fromJson(i)).toList(),         overview = jsonMap['overview'],         tagline = jsonMap['tagline'],         id = jsonMap['id']; } class Genre {   final int id;   final String genre;    const Genre(this.id, this.genre);    Genre.fromJson(Map jsonMap)     : id = jsonMap['id'],       genre = jsonMap['name']; } 

My issue is that I can't get the genre to parse properly from the JSON. When I get the JSON and pass it through my model class, I get the following error:

I/flutter (10874): type 'List<dynamic>' is not a subtype of type 'List<Genre>' where I/flutter (10874):   List is from dart:core I/flutter (10874):   List is from dart:core I/flutter (10874):   Genre is from package:flutter_app_first/models/movieDetail.dart 

I thought this would work because I have made a different class for the Genre object and passed in the JSON array as a list. I don't understand how List<dynamic> isn't a child of List<Genre> because doesn't the keyword dynamic imply any object? Does anyone know how to parse a nested JSON array into custom objects?

Answer 1

Try genres = (jsonMap['genres'] as List).map((i) => Genre.fromJson(i)).toList()

The issue: calling map without the cast makes it a dynamic call, which means the return type from Genre.fromJson is also dynamic (not Genre).

Take a look at https://flutter.io/json/ for some hints.

There are solutions, like https://pub.dartlang.org/packages/json_serializable, that makes this much easier