How to display nested json flutter - json

Question

what should I do to display this data
"result": [
{
"department_id": null,
"crime_time_id": "5562f55f-54aa-4e94-9f6c-9ce25d9e3fd9",
"village_id": "3174031001",
"cases": 3,
"villages": 3,
"target_id": null,
"department": null,
"crime_time": {
"id": "5562f55f-54aa-4e94-9f6c-9ce25d9e3fd9",
"name": "00.00 - 02.00"
},
"village": {
"id": "3174031001",
"name": "MAMPANG PRAPATAN"
}
},
{
"department_id": null,
"crime_time_id": "ca56d7a3-fdea-446a-a628-cc7091f314de",
"village_id": "1604082010",
"cases": 1,
"villages": 1,
"target_id": null,
"department": null,
"crime_time": {
"id": "ca56d7a3-fdea-446a-a628-cc7091f314de",
"name": "06.00 - 08.00"
},
"village": {
"id": "1604082010",
"name": "TANJUNG SIRIH"
}
}
]
I have try to handle this but there is some display error
'expected a value of type 'int?' but got one of type 'String' and
'the method fromjson isnt defined for the type data. try correcting the name to the name of an exsiting method
this my model:
class rangkumanKasus {
int? department_id;
String? crime_time_id;
int? village_id;
int? cases;
int? villages;
int? target_id;
String? department;
final Crime_Time crime_time;
final Village village;
rangkumanKasus({
this.department_id,
this.crime_time_id,
this.village_id,
this.cases,
this.villages,
this.target_id,
this.department,
required this.crime_time,
required this.village,
});
factory rangkumanKasus.fromJson(Map<String, dynamic> json) {
return rangkumanKasus(
department_id: json["department_id"],
crime_time_id: json['crime_time_id'],
village_id: json['village_id'],
cases: json['cases'],
villages: json['villages'],
target_id: json['target_id'],
department: json['department'],
crime_time: Crime_Time.fromJson(json['crime_time']),
village: Village.fromJson(json['village']),
);
}
}
class Crime_Time {
int? id;
String? name;
Crime_Time({
this.id,
this.name,
});
factory Crime_Time.fromJson(Map<dynamic, dynamic> json) {
return Crime_Time(
id: json['id'],
name: json['name'],
);
}
}
class Village {
int? id;
String? name;
Village({
this.id,
this.name,
});
factory Village.fromJson(Map<dynamic, dynamic> json) {
return Village(
id: json['id'],
name: json['name'],
);
}
}
and this how I try to display
Container(
child: FutureBuilder<List<rangkumanKasus>>(
future: listData,
builder: (context, snapshot) {
if (snapshot.hasData) {
List<rangkumanKasus> isiData = snapshot.data!;
return ListView.builder(
shrinkWrap: true,
itemCount: isiData.length,
itemBuilder: (context, index) {
return Container(
child: Text(
isiData[index].crime_time.name!,
style: TextStyle(color: Colors.red),
));
});
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return const CircularProgressIndicator();
}),