【问题标题】:Angular post method Type 'Observable<HttpEvent>' is not assignable to type 'Observable'. Type 'HttpEvent' is not assignable to type 'TestUser'Angular post 方法类型“Observable<HttpEvent>”不可分配给类型“Observable”。类型“HttpEvent”不可分配给类型“TestUser”
【发布时间】:2021-05-21 08:00:02
【问题描述】:

我正在尝试使用 POST 方法将一些数据保存到我的测试服务器。 (服务器本身的方法已经开始工作了)

我希望能够将用户数据添加到单独的输入字段并通过一个按钮将它们发送到服务器,以便我可以使用另一个按钮显示存储的数据。 get 方法已经完成了这项工作并显示了来自我的服务器的测试数据,但我在使用 post 方法时遇到了问题。

我在 addUser() 函数中收到此消息,即使我尝试调整英雄之旅 Post 示例。

我错过了什么或做错了什么?

TS2322:类型 'Observable' 不可分配给 输入“可观察”。类型 'HttpEvent' 不是 可分配给类型“TestUser”。类型“HttpSentEvent”缺少 来自“TestUser”类型的以下属性:id、firstName、lastName、 是活跃的

testService.ts

import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {Observable, throwError} from 'rxjs';
import {TestUser} from './testUser';
import {catchError, tap} from 'rxjs/operators';
    
@Injectable({
  providedIn: 'root'
})
export class TestService {
    
  testUrl = 'http://localhost:3000/users';
    
  constructor(private http: HttpClient) {}
    
  getUser(id: number): Observable<TestUser> {
    const url = `${this.testUrl}/${id}`;
    console.log('a');
    console.log(this.http.get<TestUser>(this.testUrl));
    return this.http.get<TestUser>(url);
  }
    
  addUser(newUser: TestUser): Observable<TestUser> {
    return this.http.post<TestUser>(this.testUrl, newUser, this.httpOptions);
  }
}

testUser.ts

export interface TestUser {
  id: number;
  firstName: string;
  lastName: string;
  isActive: boolean;
}
    
export const TEST_USER_EMPTY: TestUser = {
  id: 0,
  firstName: '',
  lastName: '',
  isActive: false,
};

【问题讨论】:

    标签: angular post nestjs


    【解决方案1】:

    您应该关注 post 方法中的最后一个参数 - this.httpOptions。不幸的是,您没有与我们分享它的外观,但查看 HttpClient 的定义,我们发现根据传递的 post 方法的参数,它可能会返回不同的类型 - 其中之一是

    Observable<HttpEvent<Object>>
    

    您是否在选项中使用了以下语句?

    observe: 'events';
    

    如果不是,可能是 httpOptions 对象的格式不正确,导致 angular 返回错误的类型。

    【讨论】:

      猜你喜欢
      • 2019-01-12
      • 2021-09-23
      • 2018-04-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2023-04-10
      • 2020-08-24
      相关资源
      最近更新 更多