Question

我已经参考错误TS2322尝试了所有其他发布在堆栈上的解决方案，但是找不到能够解决问题的解决方案。

产生错误

ERROR in src/app/service/user.service.ts(21,9): error TS2322: Type 'Observable<{} | User>' is not assignable to type 'Observable<User>'.
  Type '{} | User' is not assignable to type 'User'.
    Type '{}' is not assignable to type 'User'.
      Property 'id' is missing in type '{}'.

user.service

import { Injectable } from '@angular/core';
import { BaseService } from './base.service';
import { HttpClient } from '@angular/common/http';
import { environment } from '../../environments/environment';
import { User } from '../model/user';
import { MessageService } from './message.service';
import { Observable, of } from 'rxjs';
import { catchError, map, tap } from 'rxjs/operators';

@Injectable({
    providedIn: 'root'
})
export class UserService extends BaseService {

    constructor(
        http: HttpClient,
        messageService: MessageService,
    ) { super(messageService, http); }

    login(login: string, password: string): Observable<User> {
        // Error thrown on line below
        return this.http.post<User>(environment.serverUrl + 'api/user/login', {'login': login, 'password': password}).pipe(
            tap(user => this.log(`logged in ` + user)),
            catchError(this.handleError('login'))
        );
    }
}

user.ts

import { BlogPost } from "./blog-post";
import { JobNote } from "./job-note";
import { BaseModel } from "./base-model";

export class User extends BaseModel {
    id: number;
    login: string;
    name: string;
    api_token: string;
    isAdmin: boolean;
    email: string;
    address1: string;
    address2: string;
    address3: string;
    phoneHome: string;
    phoneWork: string;
    phoneMobile: string;
    fax: string;
    blogPosts: BlogPost[];
    notes: JobNote[];
}

基本服务

import { Injectable } from '@angular/core';
import { User } from '../model/user';
import { ApprovedClaim } from '../model/approved-claim';
import { BlogCategory } from '../model/blog-category';
import { Observable, of } from 'rxjs';
import { catchError, map, tap } from 'rxjs/operators';
import { MessageService } from './message.service';
import { throwError } from 'rxjs';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { environment } from '../../environments/environment';

export class BaseService {
    constructor(
        protected messageService: MessageService,
        protected http: HttpClient,
    ) { }

    protected handleError<T>(operation = 'operation', result?: T) {
        return (error: any): Observable<T> => {
            let errMsg = `error in ${operation}()`;
            console.error(error); // log to console instead

            this.log(`${operation} failed: ${error.message}`);

            return throwError(errMsg);
        };
    }

    protected log(message: string) {
        this.messageService.add(message);
    }
}

从用户更改为任何人

有人建议（删除答案）将Observable<User>更改为Observable<any>，这样可以编译，但是为什么呢？期望User对象作为响应有什么区别。

编辑：关于重复标签，我已经在做建议的答案。该错误消息还与可观察到的用户对象不匹配用户有关，而不是空对象。

Answer 1

handleError函数具有一个通用参数，如果未指定，则该函数将返回(error: any) => Observable<{} >，并在最终结果中引入{}。

尝试一下：

login(login: string, password: string): Observable<User> {
    return this.http.post<User>(environment.serverUrl + 'api/user/login', {'login': login, 'password': password}).pipe(
        tap(user => this.log(`logged in ` + user)),
        catchError(this.handleError<User>('login'))
    );
}

键入'Observable <{} |不能将User>'分配为类型'Observable <user>'

user.ts

1 个答案: