angular 错误处理无法使用 angular 12

Question

我尝试了 angular 错误管理器，我创建了一个 posts.component.ts 组件，我创建了一个 posts.service.ts 服务，我通过 api 检索了 posts : https://jsonplaceholder.typicode.com/posts, 100 posts，现在通过删除不存在的 post post n123 产生错误。当我单击删除按钮时，它不会管理任何警报或控制台错误。

post.component.html

<ul class="list-group">
    <li class="list-group-item" *ngFor="let post of posts">
        <h4>{{ post.title }}</h4>
        <p>{{ post.body }}</p>
        <div align="right">
            <button class="btn btn-warning" (click)="editPost(post)">Edit</button>
            <button class="btn btn-danger" (click)="deletePost(post)">Delete</button> 
       </div>
    </li>
</ul>

post.service.ts

deletePost(post:any){
     return this.http.delete(this.url + "/" + post.id)
   }

post.component.ts

deletePost(post:any){
    this.postService.deletePost(post)
    .subscribe((response:any)=>{
          let index = this.posts.indexOf(post);
          index=123;
          this.posts.splice(index,1);
        },(error:Response) => {
          if(error.status === 404){
            alert("ce post deja supprimer")
          }else{
            alert("error server");
            console.log(error);
          }
        })
  };

Answer 1

这与您的代码无关。 API 以 HTTP 状态代码 200 响应，即使在尝试删除不存在的 post 时也是如此。这基本上意味着，即使因为不存在而无法删除任何内容，https://jsonplaceholder.typicode.com/ 响应操作顺利进行。

您可以使用您选择的客户端进行测试，例如 postman。我已将请求保存在这里：https://documenter.getpostman.com/view/11980158/UVeCPTWx 你可以通过点击右上角的“运行 in Postman”来执行，看到它returns和200.

Answer 2

this.Service.functionName(form)
.subscribe((response:any)=>{
      let index = this.posts.indexOf(post);
      index=123;
      this.posts.splice(index,1);
    },(error:Response) => {
      if(error.status === 404){
        alert("opps! Got error")
      }else{
        alert("error server");
        console.log(error);
      }
    })

angular 错误处理无法使用 angular 12

angular error handling not working using angular 12

error-handling

runtime-error

angular

angular12