STUDY

[Angular] @angular/common/http

꿀떡최고 2022. 2. 6. 17:43
반응형
npm i @angular/common

 

- app.module.ts 추가

import { HttpClientModule } from '@angular/common/http';

imports: [
    HttpClientModule
],

 

- constructor

  constructor(private http: HttpClient) { }

 

- get

  apiTest() {
    this.http.get('https://jsonplaceholder.typicode.com/todos/1').subscribe((res) => {
      console.log(res)
    })
  }

 

- post

  apiTest() {
    this.http.post('https://jsonplaceholder.typicode.com/posts', 
    {
      title: 'foo',
      body: 'bar',
      userId: 1,
    })
    .subscribe((res) => {
      console.log(res)
    })
  }

 

- put

  apiTest() {
    this.http.put('https://jsonplaceholder.typicode.com/posts/1',
    {
      id: 1,
      title: 'foo',
      body: 'bar',
      userId: 1,
    })
    .subscribe((res) => {
      console.log(res)
    })
  }

 

- delete

  apiTest() {
    this.http.delete('https://jsonplaceholder.typicode.com/posts/1')
    .subscribe((res) => {
      console.log(res)
    })
  }
반응형