CODEWITHSUNDEEP
angularhttpangular7
Seyed-Amir-Mehrizi
Seyed-Amir-Mehrizi

Reputation: 739

HTTP error in delete method not working properly

I have a problem when I am working with HTTP delete method. I have a URL that makes fake API. The address is like this:

private URL = 'http://jsonplaceholder.typicode.com/posts';

I use get method and store it in the variable data and by use of that I generate one table dynamically just like this:

<table class="table table-bordered">
    <thead>
        <tr>
            <th>userId</th>
            <th>id</th>
            <th>title</th>
            <th>Tools</th>

        </tr>
        <tr>
            <th><input type="text" #userId></th>
            <th><input type="text" #id></th>
            <th><input type="text" #title></th>

        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let item of data">
            <td>{{item.userId}}</td>
            <td>{{item.id}}</td>
            <td>{{item.title}}</td>
            <td><button class="btn btn-warning" (click)="updateItem(item)">Update</button>
                <button class="btn btn-danger" (click)="deleteData(item)">Delete</button>
            </td>
        </tr>
    </tbody>
</table>

All my methods work great. But when I want to implement error in my ts file, in the deleteData method I have a problem. The code below is deleteData in my ts file:

deleteData(item) {
       this.service.deletePost(item.id)
       .subscribe(
        response => {
        let index = this.data.indexOf(item);
        this.data.splice(index, 1);
        });    
}

I also use service to call my delete service just like that:

  deletePost(id){
    return this.http.delete(this.url+'/'+id);
  }

My problem:

As you know the second parameter of subscribe method is error and I want to check the 404 not found an error in my table. I have the code just like that:

deleteData(item) {
    this.service.deletePost(345)
      .subscribe(
        response => {
        let index = this.data.indexOf(item);
        this.data.splice(index, 1);

      },
       (error:Response) => {
         console.log(error)
         if(error.status == 404)
         {
           alert('404');
         }
         else{
          alert('unexpected is occered!');
          console.log(error);
         }

      });
}

In my fake API, I have just 100 items and the last id is 100 when I put invalid id like 345 I should get not found the error and then handle that. But unfortunately it does not happen and the item is deleted. What is wrong with my code?

Upvotes: 1

Views: 1449

Answers (1)

TheParam
TheParam

Reputation: 10531

JSONPlaceholder is fake backend API server. It won't actually delete anything from their server.

So according to their documentation on Github it will always return the 200 as the response if you trying to delete something from the server.

Here is Screenshot

enter image description here

Hope this will help!

Upvotes: 2

Related Questions