使用 Angular HttpClient 在 DELETE 请求完成后执行某些操作

Question

我有一个按钮，可以在单击时删除一个项目。我想在操作完成后显示一个简单的 alert('Item deleted') 警报。但是我似乎无法让它发挥作用。请注意，该项目已被删除。

这是我尝试过的：

我的组件中的 deleteItem 函数

deleteItem(id: number) {
    this.eventsService
      .deleteEventById(id)
      .subscribe(
        res => console.log(res),
        err => console.log(err),
        () => alert('Item deleted')
      );
  }

控制台上未打印任何内容，也未显示任何警报。

deleteEventById 我服务中的函数

deleteEventById(id: number) {
  return this.http
    .delete(`/api/events/${id}`, this.headerForPrivateCalls)
    .pipe(
      catchError(this.handleError),
    );
}

api 路线（如果重要的话）

router.delete('/events/:id', authCheck, (req, res) => {
    connection((client) => {
        client.db('gordes').collection('events')
        .deleteOne({id: +req.params.id})
        .then(() => {
            res.status(204);
        })
        .catch((err) => {
            sendError(err, res);
        });
    })
});

Answer 1

您的 deleteEventById 服务不会 return Observable。您将需要添加一个 .map()

    deleteEventById(id: number) {
       return (this.http
        .delete(`/api/events/${id}`, this.headerForPrivateCalls)
        .map(response => response.json())
        .pipe(
           catchError(this.handleError),
        );
      )
   }

编辑

问题似乎出在节点后端：

你 return 什么都没有

res.status(204);

使用：

res.status(204).send();

使用 Angular HttpClient 在 DELETE 请求完成后执行某些操作

Do something after a DELETE request is complete with Angular HttpClient

javascript

node.js

typescript

angular

angular-httpclient