Using Generic Types in Response DTO with Typescript, NestJs, and Class Transformer

Question

Using Generic Types in Response DTO with Typescript, NestJs, and Class Transformer

In my project, I am dealing with multiple endpoints that provide responses along with pagination details. My goal is to have a single parent type for the pagination and be able to use different data types for the data parameter.

I attempted the following approach, but encountered a problem where the statement within @Type resulted in an error message stating

'T' only refers to a type, but is being used as a value here.

, indicating that it requires a value or class rather than a type:

export class PaginatedResponseDto<T> {
  @Expose()
  @ApiProperty()
  skip: number;

  @Expose()
  @ApiProperty()
  take: number;

  @Expose()
  @ApiProperty()
  count: number;

  @Expose()
  @ApiProperty()
  @Type(() => T[]) // <- this is not working, because I cannot use `T` here
  data: T[];

  constructor(data: any) {
    Object.assign(this, data);
  }
}

During my research, I came across a solution (reference link provided) that seemed promising, although it led to double transformation of the response, causing complications with date values.

I am curious if there exists an alternative method to achieve this objective, instead of creating multiple PaginatedResponseDto classes?

typescript pagination nestjs class-transformer

Answer 1

Answer №1

If you're looking to achieve a similar outcome, consider the following approach...

export class PaginatedResponseDto<T> {

  @Exclude()
  private category: Function;

  @Expose()
  @ApiProperty()
  @Type(config => (config.newObject as PaginatedResponseDto<T>).category)
  items: T[];

  constructor(category: Function) {
    this.category = category;
  }
}

Answer 2

If you're looking to achieve a similar outcome, consider the following approach...

export class PaginatedResponseDto<T> {

  @Exclude()
  private category: Function;

  @Expose()
  @ApiProperty()
  @Type(config => (config.newObject as PaginatedResponseDto<T>).category)
  items: T[];

  constructor(category: Function) {
    this.category = category;
  }
}

Using Generic Types in Response DTO with Typescript, NestJs, and Class Transformer

Answer №1

Similar questions

Using Angular to Apply a Custom Validation Condition on a FormGroup Nested Within Another FormGroup

Using Conditionals in React Props

Establish a user profile and define custom claims using Firebase Authentication

Callback after completion of a for loop in Angular TypeScript

Learn the proper way to specify the return type of a function as a class, rather than an instance, in Typescript

"Implementing self-referencing mongoose models in Typescript: A step-by-step guide

Unraveling the Mystery of @Input and @Output Aliases in Angular 2

Unleashing the potential of an endless animation by incorporating pauses between each iteration

In Typescript, type errors in Object Spread Syntax are not causing any issues

What kind of null/undefined is being assumed?

Is it possible to synchronize the Lit cached DOM with the live DOM?

Discover the data type without using the extends keyword within an interface in Typescript

Displaying a div component in React and Typescript upon clicking an element

Avoiding repetitive logic in both parent and child components in Angular 8

The Angular performance may be impacted by the constant recalculation of ngStyle when clicking on various input fields

Dynamic table row that expands to show additional rows sourced from various data sets

Closing a tab in another part of the session using Typescript and Angular

The CSS styles are functioning correctly in index.html, but they are not applying properly in the component.html

Exploring Angular's filtering capabilities and the ngModelChange binding

Issue: Module not found; Typescript error encountered in a react application