The below given is my response model and I am able to display the value of message but now I want to display the value of name which is inside result I have attached the image how I am displaying the data of message now how do i display it?

{
    "message": "sucess",
    "error": false,
    "code": 200,
    "result": [
        {
            "id": 1,
            "name": "Lab Report"
        },
        {
            "id": 2,
            "name": "News"
        },
        {
            "id": 3,
            "name": "X-ray"
        },
        {
            "id": 8,
            "name": "Blood Test"
        }
    ],
    "status": 200
}

This is how I am displaying the value of message using future builder

Column(
              children: [
                 FutureBuilder<Categories>(
                     future: futureAlbum,
                     builder: (context,snapshot){
                   if(snapshot.hasData){
                     return Text(snapshot.data!.message ?? "");
                   }else if(snapshot.hasError){
                     return Text("${snapshot.error}");
                   }   return const CircularProgressIndicator();
                 })
              ],
            ),

This is my model class

class Categories {
  String? message;
  bool? error;
  int? code;
  List<Result>? result;
  int? status;

  Categories({this.message, this.error, this.code, this.result, this.status});

  Categories.fromJson(Map<String, dynamic> json) {
    message = json['message'];
    error = json['error'];
    code = json['code'];
    if (json['result'] != null) {
      result = <Result>[];
      json['result'].forEach((v) {
        result!.add(new Result.fromJson(v));
      });
    }
    status = json['status'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['message'] = this.message;
    data['error'] = this.error;
    data['code'] = this.code;
    if (this.result != null) {
      data['result'] = this.result!.map((v) => v.toJson()).toList();
    }
    data['status'] = this.status;
    return data;
  }
}

class Result {
  int? id;
  String? name;

  Result({this.id, this.name});

  Result.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    name = json['name'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['name'] = this.name;
    return data;
  }
}

This is Api class

import 'dart:convert';
import 'package:flutter/foundation.dart';
import 'package:http/http.dart' as http;
import 'ModelsForCategories.dart';

class RemoteService {
  Future<Categories> fetchAlbum() async {
    final response = await http.get(Uri.parse("http://10.0.2.2:8000/api_vi/getcategories/"));

    if (response.statusCode == 200) {
      return Categories.fromJson(json.decode(response.body));
    } else {
      throw Exception('Failed to load album');
    }
  }
}

CodePudding user response：

Try snapshot.data!.result[0].name

For instance if you want to display the name in the first of the result list.

Column(
              children: [
                 FutureBuilder<Categories>(
                     future: futureAlbum,
                     builder: (context,snapshot){
                   if(snapshot.hasData){
                     return Text(snapshot.data?.result[0]?.name ?? "");
                   }else if(snapshot.hasError){
                     return Text("${snapshot.error}");
                   }   return const CircularProgressIndicator();
                 })
              ],
            ),