0
0
NestjsHow-ToBeginner ยท 3 min read

How to Use @Put Decorator in NestJS: Simple Guide

In NestJS, use the @Put decorator to define a route handler for HTTP PUT requests inside a controller. It marks a method to respond when the client sends a PUT request to the specified path. You can optionally provide a route path inside @Put('path') to handle specific URLs.
๐Ÿ“

Syntax

The @Put decorator is used above a controller method to handle HTTP PUT requests. You can specify an optional route path as a string argument. The method can accept parameters like @Body() to get the request body.

  • @Put(): Handles PUT requests to the controller's base path.
  • @Put('subpath'): Handles PUT requests to the base path plus /subpath.
  • Method parameters: Use decorators like @Body() to access request data.
typescript
import { Controller, Put, Body, Param } from '@nestjs/common';

@Controller('items')
export class ItemsController {
  @Put() // Handles PUT /items
  updateItem(@Body() data: any) {
    // update logic here
  }

  @Put(':id') // Handles PUT /items/:id
  updateItemById(@Body() data: any, @Param('id') id: string) {
    // update logic for specific id
  }
}
๐Ÿ’ป

Example

This example shows a simple NestJS controller using @Put to update an item by its ID. It accepts JSON data in the request body and returns a confirmation message.

typescript
import { Controller, Put, Body, Param } from '@nestjs/common';

@Controller('products')
export class ProductsController {
  private products = [{ id: '1', name: 'Book' }];

  @Put(':id')
  updateProduct(@Param('id') id: string, @Body() updateData: { name: string }) {
    const product = this.products.find(p => p.id === id);
    if (!product) {
      return { message: 'Product not found' };
    }
    product.name = updateData.name;
    return { message: 'Product updated', product };
  }
}
Output
PUT /products/1 with body {"name":"Notebook"} returns {"message":"Product updated","product":{"id":"1","name":"Notebook"}}
โš ๏ธ

Common Pitfalls

Common mistakes when using @Put include:

  • Not specifying a route path when needed, causing conflicts with other routes.
  • Forgetting to use @Body() to access the request body, resulting in undefined data.
  • Using @Put for partial updates instead of @Patch, which is more appropriate.

Always ensure your method parameters match the expected request data.

typescript
import { Controller, Put, Body } from '@nestjs/common';

@Controller('users')
export class UsersController {
  // Wrong: Missing @Body() decorator
  @Put(':id')
  updateUser(data: any) {
    // data will be undefined
  }

  // Right: Use @Body() to get request body
  @Put(':id')
  updateUserCorrect(@Body() data: any) {
    // data contains the request body
  }
}
๐Ÿ“Š

Quick Reference

Use this quick reference to remember how to use @Put in NestJS:

UsageDescription
@Put()Handles PUT requests to the controller base path
@Put('path')Handles PUT requests to a specific subpath
@Put(':id')Handles PUT requests with a dynamic parameter
@Body()Decorator to access the request body inside the method
@Param('id')Decorator to access route parameters
โœ…

Key Takeaways

Use @Put to handle HTTP PUT requests in NestJS controllers.
Specify route paths inside @Put('path') to target specific URLs.
Use @Body() to access the request body data in your method.
Avoid missing decorators like @Body() to prevent undefined data.
Use @Put for full updates; consider @Patch for partial updates.