CODEWITHSUNDEEP
angulartypescript
Lajith
Lajith

Reputation: 1867

upgrading to angular application to v10 error getting

Am executing demo app .Am new to angulat. and Below is my caltegory list component.

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

import { AngularGridInstance, Column, GridOption, GraphqlService, GraphqlResult, Filters, Formatters, OnEventArgs, FieldType } from 'angular-slickgrid';

import { CategoryDataService } from 'src/app/core/services/category-data.service';
import { PageService } from 'src/app/core/services/page.service';


const GRAPHQL_QUERY_DATASET_NAME = 'categories';


@Component({
  templateUrl: './category-list.component.html',
  styleUrls: ['./category-list.component.css']
})
export class CategoryListComponent implements OnInit {
  angularGrid: AngularGridInstance;
  columnDefinitions: Column[];
  gridOptions: GridOption;
  dataset = [];

  constructor(private dataService: CategoryDataService, private router: Router, private pageService: PageService) {
  }

  ngOnInit(): void {
    this.columnDefinitions = [
        ...removed
    ];

    this.gridOptions = {
      backendServiceApi: {
        service: new GraphqlService(),
        options: {
          columnDefinitions: this.columnDefinitions,
          datasetName: GRAPHQL_QUERY_DATASET_NAME
        },
        process: (query) => this.getCategories(),
      }
    };;
  }

 
  getCategories(): Observable<GraphqlResult> {
    var args = this.pageService.getPageArgs(this.angularGrid);

    return this.dataService.searchCategories(args)
      .pipe(map(
        page => {
          var result: GraphqlResult = {
            data: {
              [GRAPHQL_QUERY_DATASET_NAME]: {
                nodes: page.items,  ---here i am getting error
                pageInfo: {
                  hasNextPage: page.hasNextPage
                },
                totalCount: page.totalCount
              }
            }
          };

          return result;
        }));
  }
}

The demo project working fine before. and when i updated to latest slick grid version , i am getting below error.. it is showing not type any ... Pls let me know how to convert generic class to any type ..Thanks

Error

And interface for Pagination.

export interface IPagedList<T> {
     pageIndex: number;
     .... removed
    
    items: T[];
}

Error: Type of computed property's value is '{ nodes: IProduct[]; pageInfo: { hasNextPage: boolean; }; totalCount: number; }', which is not assignable to type 'any[]'. Object literal may only specify known properties, and 'nodes' does not exist in type 'any[]'.

Upvotes: 0

Views: 92

Answers (1)

ghiscoding
ghiscoding

Reputation: 13194

There was a small breaking change in version 2.15.x of Angular-Slickgrid, I added a new Type GraphqlPaginatedResult when using Pagination and GraphqlResult when you're not, it's more representative of which one is which. So you just need to switch your Type to GraphqlPaginatedResult. I didn't want to release a breaking version (3.x) just for that 1 small Type change (and I thought no one were using the GraphQL portion lol), so you'll need to update your code (just do a find+replace from GraphqlResult to GraphqlPaginatedResult).

getCategories(): Observable<GraphqlPaginatedResult> {

It was explained in this Release changelog.

Also when that change was done, I created a new Example 27 - Graphql without Pagination which is the one that uses GraphqlResult while the previous Example 6 - Graphql uses the new GraphqlPaginatedResult Type.

Upvotes: 1

Related Questions