How To Sort Nested ObjectData Flutter

Question

I am trying to sort a JSON object that has nested data. I want to refresh the List of object each time a button is pressed but, I am having issues doing so. I am trying to sort by price and this is my code so far:

Data:

  {
            "id": 152,
            "name": "Advil",
            "short_description": "Advil 20 Pack",
            "usage": "Headaches",
            "effect": "MoodSwings",
            "sizes": [
                {
                    "id": 307,
                    "size": 4,
                    "product_id": 152,
                    "price": 4.99
                },
                {
                    "id": 308,
                    "size": 5,
                    "product_id": 152,
                    "price": 12.66
                }
            ],
}

My model is set up like this:

 Product(
      {this.id,
      this.name,
      this.shortDescription,
      this.image,
      this.image2,
      this.image3,
      this.type,
      this.sizes,
      this.usage,
      this.filter,
      this.category,
      this.prodSize});

  factory Product.fromJSON(Map<String, dynamic> json) {
    var sizes = json['sizes'] as List;
    print(sizes.runtimeType);
    List<ProductSizes> sizeList =
        sizes.map((i) => ProductSizes.fromJSON(i)).toList();

    return Product(
      id: json['id'],
      name: json['name'],
      shortDescription: json['short_description'],
      image: json['image'],
      image2: json['image2'],
      image3: json['image3'],
      type: json['Product_Type'],
      sizes: sizeList,
      usage: json['usage'],
      filter: json['filter'],
      category: json['Product_Category'],   
    );
  }
}

class ProductSizes {
  int id;
  int size;
  int productId;
  double price;

  ProductSizes({this.id, this.size, this.productId, this.price});

  factory ProductSizes.fromJSON(Map<String, dynamic> json) {
    return ProductSizes(
        id: json['id'],
        size: json['size'],
        productId: json['product_id'],
        price: json['price']);
  }
}

My switch case that is tied to a dropdownbutton:

void _sortProductsDropDown(_filterDropdown, productList) {
    var tempProducts;

    setState(() {
      switch (_filterDropdown) {
        case 'Price: Low-High':
          for (int i = 0; i < productList.length; i++) {
            tempProducts.add(productList[i]
                .sizes
                .sort((a, b) => b.$price.reversed(a.price)));
          }
_productTabFilter = tempProducts;
          print(tempProducts.toString());
          break;
        case 'Price: High-Low':
          print(_filterDropdown);
for (int i = 0; i < productList.length; i++) {
            tempProducts.add(productList[i]
                .sizes
                .sort((a, b) => a.$price.compareTo(b.price)));
          }
_productTabFilter = tempProducts;

          print(tempProducts.toString());
          break;

      }
    });

    // return productList;
  }

That is being called by the onchange method for the drop down button here:

void _changeFilterList(String value) {
    //use _filterDropdown for switch statement
    setState(() {
      _filterDropdown = value;
    });
    print(' the value of the dropdown is $_filterDropdown');
    _sortProductsDropDown(_filterDropdown, productList);
  }

Then I use a gridview builder to make the data

 return GridView.builder(
                        itemCount: _productTabFilter.length,
                        controller: ScrollController(),
                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 2,
                            mainAxisSpacing: 20,
                            childAspectRatio: 0.7),
                        shrinkWrap: true,
                        scrollDirection: Axis.vertical,
                        itemBuilder: (context, i) {

Then it throws this error:

[VERBOSE-2:ui_dart_state.cc(157)] Unhandled Exception: type '(dynamic, dynamic) => dynamic' is not a subtype of type '(ProductSizes, ProductSizes) => int' of 'compare'

Any help would be appreciated

Answer 1

Try casting that object to a List and then use the sort function on that list.

like this:

(productList[i]['sizes'] as List).sort((a, b) => a['price'].compareTo(b['price']))