Question

尝试在我的角应用的帖子组件中删除来自jsonplaceholder / post网站的帖子。在使用服务从Json占位符调用delete HTTP时，我收到以下错误。

src / app / components / post / post.component.ts（5,27）中的错误：错误TS2307：找不到模块＆＃39; async_hooks＆＃39;。 src / app / components / post / post.component.ts（55,35）：error TS2345：类型＆＃39; Number＆＃39;的参数不能指定类型＆＃39;数字|的参数帖子＆＃39 ;. 输入＆＃39; Number＆＃39;不能分配到＆＃39; Post＆＃39;。财产＆＃39; id＆＃39;类型＆＃39;数字＆＃39;
中缺少

这是发生删除的组件中的删除帖子方法：

removePost(post: Post) {
if (confirm('Are you Sure?')) {
  this.postService.removePost(post.id).subscribe(() => { //calling the service using the dependency injection and subscribing it to the function in the service
    this.posts.forEach((cur, index) => {
      if (post.id === cur.id ) {
        this.posts.splice(index, 1);
      }
    });
  });
}

}

这是服务中的removePost方法：

removePost(post: Post | number): Observable<Post> {
const id = typeof post === 'number' ? post : post.id;
const url = `${this.postsUrl}/${id}`;

return this.http.delete<Post>(url, httpOptions);

}

HTML文件

    <div class="card mb-2" *ngFor= 'let msg of posts'>
  <div class="card-body">
    <h3>{{msg.title}}</h3>
    {{msg.body}}
    <hr>
    <button (click)= 'removePost(msg)' class="btn btn-danger">
      <i class="fa fa-remove light"></i>
    </button>

    <button (click)='editPost(msg)' class="btn btn-light">
      <i class="fa fa-pencil light"></i>
    </button>

  </div>
</div>

Answer 1

正如错误消息所述，问题是number没有像Post-object那样的字段id。这就是为什么打字稿拒绝接受此方法签名为有效的原因。对象必须具有相同的必填字段集。

您可以尝试创建一个包含Post-Object包含的所有字段的包装器对象，并将number添加为附加字段。但我会避免这种努力，而是尝试使用两种不同的方法共享主要方法：

不知怎的，这样：

您的TS文件

removePost(post: Post) {
    if (confirm('Are you Sure?')) {
      this.postService.removePostById(post.id).subscribe(() => { 
          this.posts.forEach((cur, index) => {
              if (post.id === cur.id ) {
                   this.posts.splice(index, 1);
              }
          });
      });
   }
}

您的服务

public removePostById(id: number): Observable<Post> {
    return this.removePost(id);
}

public removePostByPostObject(post: Post): Observable<Post> {
    return this.removePost(post.id);
}

private removePost(id: number): Observable<Post> {
    const url = `${this.postsUrl}/${id}`;

    return this.http.delete<Post>(url, httpOptions);
}

找不到模块＆＃39; async_hooks＆＃39;在角度应用程序中

1 个答案: