How can I call data from a Model class which in List<Model> ? Flutter

Question

Here I am face a issue , When I am trying to get data from api with Model class I can't find the model class object. When I am use object.first/last.object then I can Found the api data. Like this....

please check this image

and Without first/last I don't get any class data : here the issue:::

enter image description here

When I am remove name from a model then I found the class object.

Please help me How can I solve the issue. Thanks Dear.

Here is the code SubCategoryPage.dart Code::::

import 'package:Darucheeni/src/models/categoryListModel.dart';
import 'package:Darucheeni/src/pages/childCategoryPage.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:ionicons/ionicons.dart';
import '../configs/appColors.dart';
import '../configs/appConfigs.dart';
import '../widgets/customBackButton.dart';
import '../widgets/kText.dart';

class SubCategoryPage extends StatelessWidget {
  final int? id;
  final CategoryListModel categoryModel;

  SubCategoryPage({
    required this.id,
    required this.categoryModel,
  });

  @override
  Widget build(BuildContext context) {
    print(categoryModel.subcategories!.length);
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: false,
        title: Row(
          children: [
            customBackButton(),
            SizedBox(width: 10),
            KText(
              text: 'All Sub Categories',
              fontSize: 20,
              color: black,
              fontFamily: segoeBoldFonts,
            ),
          ],
        ),
      ),
      body: ListView(
        children: [
          ListView.builder(
            itemCount: categoryModel.subcategories!.length,
            shrinkWrap: true,
            primary: false,
            itemBuilder: (context, index) {
              return ListTile(
                onTap: () => Get.to(ChildCategoryPage()),
                leading: Icon(Ionicons.list_outline),
                title: KText(
                  text: categoryModel.subcategories!.first.subcategoryName
                      .toString(),
                  color: black,
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

Here is Model Class Code :

class AllCategoryProductModel {
  Products? products;
  Category? category;
  List<Subcategories>? subcategories;

  AllCategoryProductModel({this.products, this.category, this.subcategories});

  AllCategoryProductModel.fromJson(Map<String, dynamic> json) {
    products = json['products'] != null
        ? new Products.fromJson(json['products'])
        : null;
    category = json['category'] != null
        ? new Category.fromJson(json['category'])
        : null;
    if (json['subcategories'] != null) {
      subcategories = <Subcategories>[];
      json['subcategories'].forEach((v) {
        subcategories!.add(new Subcategories.fromJson(v));
      });
    }
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.products != null) {
      data['products'] = this.products!.toJson();
    }
    if (this.category != null) {
      data['category'] = this.category!.toJson();
    }
    if (this.subcategories != null) {
      data['subcategories'] =
          this.subcategories!.map((v) => v.toJson()).toList();
    }
    return data;
  }
}

class Products {
  int? currentPage;
  List<Data>? data;
  String? firstPageUrl;
  int? from;
  int? lastPage;
  String? lastPageUrl;
  Null? nextPageUrl;
  String? path;
  int? perPage;
  Null? prevPageUrl;
  int? to;
  int? total;

  Products(
      {this.currentPage,
      this.data,
      this.firstPageUrl,
      this.from,
      this.lastPage,
      this.lastPageUrl,
      this.nextPageUrl,
      this.path,
      this.perPage,
      this.prevPageUrl,
      this.to,
      this.total});

  Products.fromJson(Map<String, dynamic> json) {
    currentPage = json['current_page'];
    if (json['data'] != null) {
      data = <Data>[];
      json['data'].forEach((v) {
        data!.add(new Data.fromJson(v));
      });
    }
    firstPageUrl = json['first_page_url'];
    from = json['from'];
    lastPage = json['last_page'];
    lastPageUrl = json['last_page_url'];
    nextPageUrl = json['next_page_url'];
    path = json['path'];
    perPage = json['per_page'];
    prevPageUrl = json['prev_page_url'];
    to = json['to'];
    total = json['total'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['current_page'] = this.currentPage;
    if (this.data != null) {
      data['data'] = this.data!.map((v) => v.toJson()).toList();
    }
    data['first_page_url'] = this.firstPageUrl;
    data['from'] = this.from;
    data['last_page'] = this.lastPage;
    data['last_page_url'] = this.lastPageUrl;
    data['next_page_url'] = this.nextPageUrl;
    data['path'] = this.path;
    data['per_page'] = this.perPage;
    data['prev_page_url'] = this.prevPageUrl;
    data['to'] = this.to;
    data['total'] = this.total;
    return data;
  }
}

class Data {
  int? id;
  String? proCategory;
  String? proSubcategory;
  String? proChildCategory;
  Null? proBrand;
  Null? proShop;
  String? proName;
  String? slug;
  String? proPurchaseprice;
  String? proOldprice;
  String? proNewprice;
  Null? proCode;
  Null? proLimit;
  String? proDescription;
  String? shortDescription;
  String? proQuantity;
  Null? aditionalshipping;
  Null? combo;
  Null? offer;
  Null? video;
  String? unit;
  Null? deliveryarea;
  Null? homedelivery;
  Null? returnwarranty;
  Null? codavailable;
  Null? warranty;
  String? proLocation;
  String? ratting;
  String? status;
  String? createdAt;
  String? updatedAt;
  String? reviewsCount;
  Image? image;

  Data(
      {this.id,
      this.proCategory,
      this.proSubcategory,
      this.proChildCategory,
      this.proBrand,
      this.proShop,
      this.proName,
      this.slug,
      this.proPurchaseprice,
      this.proOldprice,
      this.proNewprice,
      this.proCode,
      this.proLimit,
      this.proDescription,
      this.shortDescription,
      this.proQuantity,
      this.aditionalshipping,
      this.combo,
      this.offer,
      this.video,
      this.unit,
      this.deliveryarea,
      this.homedelivery,
      this.returnwarranty,
      this.codavailable,
      this.warranty,
      this.proLocation,
      this.ratting,
      this.status,
      this.createdAt,
      this.updatedAt,
      this.reviewsCount,
      this.image});

  Data.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    proCategory = json['proCategory'];
    proSubcategory = json['proSubcategory'];
    proChildCategory = json['proChildCategory'];
    proBrand = json['proBrand'];
    proShop = json['proShop'];
    proName = json['proName'];
    slug = json['slug'];
    proPurchaseprice = json['proPurchaseprice'];
    proOldprice = json['proOldprice'];
    proNewprice = json['proNewprice'];
    proCode = json['proCode'];
    proLimit = json['proLimit'];
    proDescription = json['proDescription'];
    shortDescription = json['shortDescription'];
    proQuantity = json['proQuantity'];
    aditionalshipping = json['aditionalshipping'];
    combo = json['combo'];
    offer = json['offer'];
    video = json['video'];
    unit = json['unit'];
    deliveryarea = json['deliveryarea'];
    homedelivery = json['homedelivery'];
    returnwarranty = json['returnwarranty'];
    codavailable = json['codavailable'];
    warranty = json['warranty'];
    proLocation = json['proLocation'];
    ratting = json['ratting'];
    status = json['status'];
    createdAt = json['created_at'];
    updatedAt = json['updated_at'];
    reviewsCount = json['reviews_count'];
    image = json['image'] != null ? new Image.fromJson(json['image']) : null;
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['proCategory'] = this.proCategory;
    data['proSubcategory'] = this.proSubcategory;
    data['proChildCategory'] = this.proChildCategory;
    data['proBrand'] = this.proBrand;
    data['proShop'] = this.proShop;
    data['proName'] = this.proName;
    data['slug'] = this.slug;
    data['proPurchaseprice'] = this.proPurchaseprice;
    data['proOldprice'] = this.proOldprice;
    data['proNewprice'] = this.proNewprice;
    data['proCode'] = this.proCode;
    data['proLimit'] = this.proLimit;
    data['proDescription'] = this.proDescription;
    data['shortDescription'] = this.shortDescription;
    data['proQuantity'] = this.proQuantity;
    data['aditionalshipping'] = this.aditionalshipping;
    data['combo'] = this.combo;
    data['offer'] = this.offer;
    data['video'] = this.video;
    data['unit'] = this.unit;
    data['deliveryarea'] = this.deliveryarea;
    data['homedelivery'] = this.homedelivery;
    data['returnwarranty'] = this.returnwarranty;
    data['codavailable'] = this.codavailable;
    data['warranty'] = this.warranty;
    data['proLocation'] = this.proLocation;
    data['ratting'] = this.ratting;
    data['status'] = this.status;
    data['created_at'] = this.createdAt;
    data['updated_at'] = this.updatedAt;
    data['reviews_count'] = this.reviewsCount;
    if (this.image != null) {
      data['image'] = this.image!.toJson();
    }
    return data;
  }
}

class Image {
  String? image;
  String? productId;
  int? id;

  Image({this.image, this.productId, this.id});

  Image.fromJson(Map<String, dynamic> json) {
    image = json['image'];
    productId = json['product_id'];
    id = json['id'];
  }

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

class Category {
  int? id;
  String? name;
  String? slug;
  String? image;
  String? frontProduct;
  Null? level;
  String? status;
  String? createdAt;
  String? updatedAt;

  Category(
      {this.id,
      this.name,
      this.slug,
      this.image,
      this.frontProduct,
      this.level,
      this.status,
      this.createdAt,
      this.updatedAt});

  Category.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    name = json['name'];
    slug = json['slug'];
    image = json['image'];
    frontProduct = json['frontProduct'];
    level = json['level'];
    status = json['status'];
    createdAt = json['created_at'];
    updatedAt = json['updated_at'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['name'] = this.name;
    data['slug'] = this.slug;
    data['image'] = this.image;
    data['frontProduct'] = this.frontProduct;
    data['level'] = this.level;
    data['status'] = this.status;
    data['created_at'] = this.createdAt;
    data['updated_at'] = this.updatedAt;
    return data;
  }
}

class Subcategories {
  int? id;
  String? subcategoryName;
  String? slug;
  String? image;
  String? banner;
  String? categoryId;
  String? status;
  String? createdAt;
  String? updatedAt;
  List<Productcount>? productcount;

  Subcategories(
      {this.id,
      this.subcategoryName,
      this.slug,
      this.image,
      this.banner,
      this.categoryId,
      this.status,
      this.createdAt,
      this.updatedAt,
      this.productcount});

  Subcategories.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    subcategoryName = json['subcategoryName'];
    slug = json['slug'];
    image = json['image'];
    banner = json['banner'];
    categoryId = json['category_id'];
    status = json['status'];
    createdAt = json['created_at'];
    updatedAt = json['updated_at'];
    if (json['productcount'] != null) {
      productcount = <Productcount>[];
      json['productcount'].forEach((v) {
        productcount!.add(new Productcount.fromJson(v));
      });
    }
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['subcategoryName'] = this.subcategoryName;
    data['slug'] = this.slug;
    data['image'] = this.image;
    data['banner'] = this.banner;
    data['category_id'] = this.categoryId;
    data['status'] = this.status;
    data['created_at'] = this.createdAt;
    data['updated_at'] = this.updatedAt;
    if (this.productcount != null) {
      data['productcount'] = this.productcount!.map((v) => v.toJson()).toList();
    }
    return data;
  }
}

class Productcount {
  int? id;
  String? proCategory;
  String? proSubcategory;
  String? proChildCategory;
  Null? proBrand;
  Null? proShop;
  String? proName;
  String? slug;
  String? proPurchaseprice;
  String? proOldprice;
  String? proNewprice;
  Null? proCode;
  Null? proLimit;
  String? proDescription;
  String? shortDescription;
  String? proQuantity;
  Null? aditionalshipping;
  Null? combo;
  Null? offer;
  Null? video;
  String? unit;
  Null? deliveryarea;
  Null? homedelivery;
  Null? returnwarranty;
  Null? codavailable;
  Null? warranty;
  String? proLocation;
  String? ratting;
  String? status;
  String? createdAt;
  String? updatedAt;

  Productcount(
      {this.id,
      this.proCategory,
      this.proSubcategory,
      this.proChildCategory,
      this.proBrand,
      this.proShop,
      this.proName,
      this.slug,
      this.proPurchaseprice,
      this.proOldprice,
      this.proNewprice,
      this.proCode,
      this.proLimit,
      this.proDescription,
      this.shortDescription,
      this.proQuantity,
      this.aditionalshipping,
      this.combo,
      this.offer,
      this.video,
      this.unit,
      this.deliveryarea,
      this.homedelivery,
      this.returnwarranty,
      this.codavailable,
      this.warranty,
      this.proLocation,
      this.ratting,
      this.status,
      this.createdAt,
      this.updatedAt});

  Productcount.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    proCategory = json['proCategory'];
    proSubcategory = json['proSubcategory'];
    proChildCategory = json['proChildCategory'];
    proBrand = json['proBrand'];
    proShop = json['proShop'];
    proName = json['proName'];
    slug = json['slug'];
    proPurchaseprice = json['proPurchaseprice'];
    proOldprice = json['proOldprice'];
    proNewprice = json['proNewprice'];
    proCode = json['proCode'];
    proLimit = json['proLimit'];
    proDescription = json['proDescription'];
    shortDescription = json['shortDescription'];
    proQuantity = json['proQuantity'];
    aditionalshipping = json['aditionalshipping'];
    combo = json['combo'];
    offer = json['offer'];
    video = json['video'];
    unit = json['unit'];
    deliveryarea = json['deliveryarea'];
    homedelivery = json['homedelivery'];
    returnwarranty = json['returnwarranty'];
    codavailable = json['codavailable'];
    warranty = json['warranty'];
    proLocation = json['proLocation'];
    ratting = json['ratting'];
    status = json['status'];
    createdAt = json['created_at'];
    updatedAt = json['updated_at'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['proCategory'] = this.proCategory;
    data['proSubcategory'] = this.proSubcategory;
    data['proChildCategory'] = this.proChildCategory;
    data['proBrand'] = this.proBrand;
    data['proShop'] = this.proShop;
    data['proName'] = this.proName;
    data['slug'] = this.slug;
    data['proPurchaseprice'] = this.proPurchaseprice;
    data['proOldprice'] = this.proOldprice;
    data['proNewprice'] = this.proNewprice;
    data['proCode'] = this.proCode;
    data['proLimit'] = this.proLimit;
    data['proDescription'] = this.proDescription;
    data['shortDescription'] = this.shortDescription;
    data['proQuantity'] = this.proQuantity;
    data['aditionalshipping'] = this.aditionalshipping;
    data['combo'] = this.combo;
    data['offer'] = this.offer;
    data['video'] = this.video;
    data['unit'] = this.unit;
    data['deliveryarea'] = this.deliveryarea;
    data['homedelivery'] = this.homedelivery;
    data['returnwarranty'] = this.returnwarranty;
    data['codavailable'] = this.codavailable;
    data['warranty'] = this.warranty;
    data['proLocation'] = this.proLocation;
    data['ratting'] = this.ratting;
    data['status'] = this.status;
    data['created_at'] = this.createdAt;
    data['updated_at'] = this.updatedAt;
    return data;
  }
}

Answer 1

as you have created a list of subcategories in AllCategoryProductModel

 List<Subcategories>? subcategories;

it's simple, use the index variable from the itemBuilder in ListView.builder

 itemBuilder: (context, index)

to get the data variables inside the subcategories. ie :

subcategoryName=categoryModel.subcategories!.[index].subcategoryName.toString();

full code, just replace your code with the code down below . hope you got it

import 'package:Darucheeni/src/models/categoryListModel.dart';
import 'package:Darucheeni/src/pages/childCategoryPage.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:ionicons/ionicons.dart';
import '../configs/appColors.dart';
import '../configs/appConfigs.dart';
import '../widgets/customBackButton.dart';
import '../widgets/kText.dart';

class SubCategoryPage extends StatelessWidget {
  final int? id;
  final CategoryListModel categoryModel;

  SubCategoryPage({
    required this.id,
    required this.categoryModel,
  });

  @override
  Widget build(BuildContext context) {
    print(categoryModel.subcategories!.length);
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: false,
        title: Row(
          children: [
            customBackButton(),
            SizedBox(width: 10),
            KText(
              text: 'All Sub Categories',
              fontSize: 20,
              color: black,
              fontFamily: segoeBoldFonts,
            ),
          ],
        ),
      ),
      body: ListView(
        children: [
          ListView.builder(
            itemCount: categoryModel.subcategories!.length,
            shrinkWrap: true,
            primary: false,
            itemBuilder: (context, index) {
              return ListTile(
                onTap: () => Get.to(ChildCategoryPage()),
                leading: Icon(Ionicons.list_outline),
                title: KText(
                  text: categoryModel.subcategories!.[index].subcategoryName
                      .toString(),
                  color: black,
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}