Tips on using class-validator @isArray to handle cases where only a single item is received from a query parameter

Question

Tips on using class-validator @isArray to handle cases where only a single item is received from a query parameter

Currently, I am attempting to validate a request using class-validator to check if it is an array.

The inputs are sourced from query parameters like this: /api/items?someTypes=this

This is what my request dto resembles:

    (...)
    @IsArray()
    @IsEnum(SOMETHING, {each: true})
    readonly someTypes: keyof typeof SOMETHING[];
    (...)

When only one item is provided, the @IsArray validation returns an error, indicating that it is not an array.

I would like for it to be considered an array even when only one item is received via the query parameter, but I'm unsure of how to achieve this.

I am aware that using /api/items?someTypes[]=this will pass validation.

However, I am curious if there is an alternative method to address this issue.

typescript validation nestjs class-validator

Answer 1

Answer №1

If you have an array in your field and need to validate each item within the array, you will need to include the each: true option with the @IsEnum() decorator.

import { IsArray, IsEnum } from 'class-validator';

enum SomeType {
  A,
  B,
  C,
}

class SearchQuery {
  @IsArray()
  @IsEnum(SomeType, { each: true })
  types: SomeType[];
}


@Controller()
export class AppController {
  @Get()
  async search(@Query() searchQuery: SearchQuery): Promise<void> 
  { ... }
}

You can test this by making a GET request to your endpoint using the following syntax.

?types[]=A&types[]=B&types[]=C

This syntax works well if you only pass one item.

?types[]=A

If you would prefer a different format such as types=A,B,C, you can combine class-validator with class-tranformer.

class SearchQuery {
  @IsArray()
  @IsEnum(SomeType, { each: true })
  @Transform(({ value }) =>
    value
      .trim()
      .split(',')
      .map((type) => SomeType[type]),
  )
  types: SomeType[];
}

Answer 2

If you have an array in your field and need to validate each item within the array, you will need to include the each: true option with the @IsEnum() decorator.

import { IsArray, IsEnum } from 'class-validator';

enum SomeType {
  A,
  B,
  C,
}

class SearchQuery {
  @IsArray()
  @IsEnum(SomeType, { each: true })
  types: SomeType[];
}


@Controller()
export class AppController {
  @Get()
  async search(@Query() searchQuery: SearchQuery): Promise<void> 
  { ... }
}

You can test this by making a GET request to your endpoint using the following syntax.

?types[]=A&types[]=B&types[]=C

This syntax works well if you only pass one item.

?types[]=A

If you would prefer a different format such as types=A,B,C, you can combine class-validator with class-tranformer.

class SearchQuery {
  @IsArray()
  @IsEnum(SomeType, { each: true })
  @Transform(({ value }) =>
    value
      .trim()
      .split(',')
      .map((type) => SomeType[type]),
  )
  types: SomeType[];
}

Answer 3

Answer №2

Once the each option is configured, there is no requirement to utilize @IsArray. validation-arrays

Answer 4

Once the each option is configured, there is no requirement to utilize @IsArray. validation-arrays

Tips on using class-validator @isArray to handle cases where only a single item is received from a query parameter

Answer №1

Answer №2

Similar questions

Managing form input in Ionic2 components from external sources in Angular2

The variable type 'editor.IStandaloneCodeEditor' does not match the parameter type 'monaco.editor.IStandaloneCodeEditor'

Guide on converting any object with keys of type string to a generic type

Validation for HTML5 does not appear when inputmask is used for entering mobile numbers

Discover the wonders of utilizing @blur events on your custom Vue components!

I am looking for a way to transfer data collected from an input form directly to my email address without the need to open a new window. As of now, I am utilizing angular

A TypeScript class utilizing a static variable with the singleton design pattern

React: The Material-UI autocomplete input, controlled with the React Hook Form `<controller>` component, experiences issues when the `multiple` prop is set to `true`

Exploring the functionality of the WHERE function in Firebase with Angular

TypeScript class featuring a unique method that is not utilized in every instance

Automatically update data in Angular without the need to refresh the page

Encountered an error while trying to load config.ts file because of an issue

What is the best way to implement dependency injection in order to assign a validator to an entity through the IValidatableObject interface?

When using Sequelize, you may notice that extra spaces are automatically added at the end of the DataTypes.CHAR data type

Achieving VS Code/typescript autocomplete functionality without the need to import the library

Every time an action is carried out in the app, React generates countless TypeError messages

Ensuring the accuracy of the angular-formly form definition

Serve both .ts and .js files to the browser using RequireJs

How should one properly format an array of objects with elements that are different types of variations?

Using getters in a template can activate the Angular change detection cycle