Built-in pipes (ParseIntPipe, ParseBoolPipe) in NestJS - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to use ParseIntPipe to convert the route parameter to a number.

NestJS

import { Controller, Get, Param, [1] } from '@nestjs/common';

@Controller('items')
export class ItemsController {
  @Get(':id')
  getItem(@Param('id', [1]) id: number) {
    return `Item id is ${id}`;
  }
}

Drag options to blanks, or click blank then click option'

AParseIntPipe

BParseBoolPipe

CValidationPipe

DDefaultValuePipe

Attempts:

3 left

💡 Hint

Common Mistakes

Using ParseBoolPipe instead of ParseIntPipe causes type errors.

Not using any pipe leaves the parameter as a string.

The ParseIntPipe converts the route parameter id from string to number automatically.

2fill in blank

medium

Complete the code to use ParseBoolPipe to convert the query parameter to a boolean.

NestJS

import { Controller, Get, Query, [1] } from '@nestjs/common';

@Controller('flags')
export class FlagsController {
  @Get()
  getFlag(@Query('active', [1]) active: boolean) {
    return `Flag active is ${active}`;
  }
}

Drag options to blanks, or click blank then click option'

AParseIntPipe

BParseBoolPipe

CDefaultValuePipe

DValidationPipe

Attempts:

3 left

💡 Hint

Common Mistakes

Using ParseIntPipe instead of ParseBoolPipe causes wrong type conversion.

Not using any pipe leaves the parameter as a string.

The ParseBoolPipe converts the query parameter active from string to boolean automatically.

3fill in blank

hard

Fix the error in the code by choosing the correct pipe to parse the 'count' parameter as an integer.

NestJS

import { Controller, Get, Param, [1] } from '@nestjs/common';

@Controller('counts')
export class CountsController {
  @Get(':count')
  getCount(@Param('count', [1]) count: number) {
    return `Count is ${count}`;
  }
}

Drag options to blanks, or click blank then click option'

AValidationPipe

BParseBoolPipe

CDefaultValuePipe

DParseIntPipe

Attempts:

3 left

💡 Hint

Common Mistakes

Using ParseBoolPipe causes wrong type conversion.

Not using any pipe causes the parameter to remain a string.

The ParseIntPipe correctly converts the 'count' parameter to a number, fixing the error.

4fill in blank

hard

Fill both blanks to create a controller method that parses 'id' as an integer and 'enabled' as a boolean.

NestJS

import { Controller, Get, Param, Query, [1], [2] } from '@nestjs/common';

@Controller('settings')
export class SettingsController {
  @Get(':id')
  getSetting(
    @Param('id', [1]) id: number,
    @Query('enabled', [2]) enabled: boolean
  ) {
    return `Setting ${id} is ${enabled ? 'enabled' : 'disabled'}`;
  }
}

Drag options to blanks, or click blank then click option'

AParseIntPipe

BValidationPipe

CParseBoolPipe

DDefaultValuePipe

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up the pipes causes wrong type conversions.

Using ValidationPipe does not convert types automatically.

Use ParseIntPipe to convert 'id' to a number and ParseBoolPipe to convert 'enabled' to a boolean.

5fill in blank

hard

Fill all three blanks to parse 'userId' as an integer, 'isAdmin' as a boolean, and 'page' as an integer.

NestJS

import { Controller, Get, Param, Query, [1], [2], [3] } from '@nestjs/common';

@Controller('users')
export class UsersController {
  @Get(':userId')
  getUser(
    @Param('userId', [1]) userId: number,
    @Query('isAdmin', [2]) isAdmin: boolean,
    @Query('page', [3]) page: number
  ) {
    return `User ${userId}, Admin: ${isAdmin}, Page: ${page}`;
  }
}

Drag options to blanks, or click blank then click option'

AParseIntPipe

BParseBoolPipe

CDefaultValuePipe

DValidationPipe

Attempts:

3 left

💡 Hint

Common Mistakes

Using ParseBoolPipe for number parameters causes wrong type conversion.

Not using pipes leaves parameters as strings.

Use ParseIntPipe for 'userId' and 'page' to convert to numbers, and ParseBoolPipe for 'isAdmin'.

Practice

1. What is the main purpose of NestJS built-in pipes like ParseIntPipe and ParseBoolPipe?

easy

A. To create new HTTP routes in the application

B. To format output data before sending it to the client

C. To handle database connections automatically

D. To automatically convert and validate input types like numbers and booleans

Solution

1. Step 1: Understand the role of pipes in NestJS

   Pipes transform and validate incoming data before it reaches the route handler.

2. Step 2: Identify what ParseIntPipe and ParseBoolPipe do

   They convert string inputs to integer and boolean types respectively, ensuring correct data types.

3. Final Answer:

   To automatically convert and validate input types like numbers and booleans -> Option D

4. Quick Check:

   Pipe purpose = convert and validate input [OK]

Hint: Pipes transform inputs before controller methods run [OK]

Common Mistakes:

• Confusing pipes with output formatting
• Thinking pipes manage database or routing
• Assuming pipes only validate without conversion

2. Which of the following is the correct way to use ParseIntPipe in a NestJS controller method parameter?

easy

A. @Body('id', ParseIntPipe) id: string

B. @Param('id', ParseIntPipe) id: string

C. @Param('id', ParseIntPipe) id: number

D. @Query('id', ParseIntPipe) id: boolean

Solution

1. Step 1: Check the parameter decorator and pipe usage

   Using @Param('id', ParseIntPipe) applies the pipe to convert the 'id' route parameter.

2. Step 2: Match the parameter type with the pipe's output

   ParseIntPipe converts input to a number, so the parameter type must be number.

3. Final Answer:

   @Param('id', ParseIntPipe) id: number -> Option C

4. Quick Check:

   ParseIntPipe converts to number, so type = number [OK]

Hint: ParseIntPipe means parameter type must be number [OK]

Common Mistakes:

• Using string type with ParseIntPipe
• Applying pipe to wrong decorator like @Body for route param
• Assigning boolean type with ParseIntPipe

3. Given this NestJS controller method:

@Get(':active')
getStatus(@Param('active', ParseBoolPipe) active: boolean) {
  return active ? 'Active' : 'Inactive';
}

What will be the response if the client requests /true?

medium

A. "Active"

B. "Inactive"

C. 400 Bad Request error

D. "true"

Solution

1. Step 1: Understand ParseBoolPipe behavior

   ParseBoolPipe converts string 'true' to boolean true.

2. Step 2: Evaluate the method return based on boolean value

   Since active is true, the method returns 'Active'.

3. Final Answer:

   "Active" -> Option A

4. Quick Check:

   Input 'true' -> boolean true -> returns 'Active' [OK]

Hint: ParseBoolPipe converts 'true' string to boolean true [OK]

Common Mistakes:

• Expecting string 'true' instead of boolean
• Assuming 400 error for valid boolean string
• Confusing output with input string

4. Consider this NestJS controller method:

@Get(':id')
getUser(@Param('id', ParseIntPipe) id: number) {
  return `User ID is ${id}`;
}

If a client sends a request to /abc, what will happen?

medium

A. Throws a 400 Bad Request error

B. Returns 'User ID is NaN'

C. Returns 'User ID is abc'

D. Returns 'User ID is 0'

Solution

1. Step 1: Understand ParseIntPipe input validation

   ParseIntPipe tries to convert 'abc' to a number but fails.

2. Step 2: Identify NestJS behavior on invalid pipe input

   When conversion fails, NestJS returns a 400 Bad Request error automatically.

3. Final Answer:

   Throws a 400 Bad Request error -> Option A

4. Quick Check:

   Invalid int input -> 400 error [OK]

Hint: Invalid number input with ParseIntPipe causes 400 error [OK]

Common Mistakes:

• Expecting string output instead of error
• Assuming NaN is returned
• Thinking it defaults to 0

5. You want to create a NestJS route that accepts a query parameter enabled which should be a boolean. Which of the following is the best way to ensure enabled is automatically converted and validated as a boolean?

hard

A. @Query('enabled', ParseIntPipe) enabled: boolean

B. @Query('enabled', ParseBoolPipe) enabled: boolean

C. @Body('enabled', ParseBoolPipe) enabled: string

D. @Param('enabled', ParseBoolPipe) enabled: boolean

Solution

1. Step 1: Identify the correct decorator for query parameters

   Query parameters use the @Query decorator.

2. Step 2: Match the pipe and parameter type

   ParseBoolPipe converts string to boolean, so parameter type must be boolean.

3. Final Answer:

   @Query('enabled', ParseBoolPipe) enabled: boolean -> Option B

4. Quick Check:

   Query param + ParseBoolPipe + boolean type = correct [OK]

Hint: Use @Query with ParseBoolPipe for boolean query params [OK]

Common Mistakes:

• Using ParseIntPipe for boolean values
• Using @Body or @Param instead of @Query for query params
• Mismatching parameter type with pipe output