Question

我正在从Angular 5迁移到Angular 8应用程序，遇到以下错误。不确定是什么问题？

错误

Type 'unknown' is not assignable to type 'T'.  'unknown' is assignable to the constraint of type 'T', but 'T' could be instantiated with a different subtype of constraint '{}'.

代码

public getClientCompanyAccountsEndpoint<T>(clientCompanyId: number): Observable<T> {
        const url = this._baseUrl + this._clientCompanyAccountsUrl + clientCompanyId;
        return this.http.get<T>(url, this.getRequestHeaders())
        .pipe(catchError(error => {
            return this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId));
        }));
    }

进一步研究代码后，我看到定义了多个服务和端点类。我仍然不确定为什么使用泛型，因为每个端点类都有自己的getClientCompanyAccountsEndpoint方法

服务等级

@Injectable()
export class AddAccountService {

    constructor(private _addAccountEndpoint: AddAccountEndpoint){}

    getClientCompanyAccounts(clientCompanyId: number){
        return this._addAccountEndpoint.getClientCompanyAccountsEndpoint<AccountModel[]>(clientCompanyId);
    }
}

端点类

    @Injectable()
    export class AddAccountEndpoint extends EndpointFactory {
        private readonly _baseUrl: string = this.configurations.baseUrl;
        private readonly _clientCompanyAccountsUrl = '/api/client-company-accounts/';

        constructor(http: HttpClient, protected configurations: ConfigurationService, injector: Injector) {
            super(http, configurations, injector);
        }

        public getClientCompanyAccountsEndpoint<T>(clientCompanyId: number): Observable<T> {
            const url = this._baseUrl + this._clientCompanyAccountsUrl + clientCompanyId;
            return this.http.get<T>(url, this.getRequestHeaders())
            .pipe(catchError(error => {
                return this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId));
            }));
        }
    }

服务等级

        @Injectable()
    export class ClientService {

        constructor(private router: Router, private clientEndpoint: ClientEndpoint) {

        }

            getClientCompanyAccounts(clientCompanyId: number) {
               return this.clientEndpoint.getClientCompanyAccountsEndpoint<SettlementAccountModel[]>(clientCompanyId);
            }
        }

端点类

        @Injectable()
    export class ClientEndpoint extends EndpointFactory {
        private readonly _baseUrl: string = this.configurations.baseUrl;
            public getClientCompanyAccountsEndpoint<T>(clientCompanyId: number): Observable<T> {
            return this.http.get<T>(this._clientCompanyAccountsUrl + clientCompanyId, this.getRequestHeaders())
                .pipe(catchError(error => {
                    return this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId));
                }));
        }
        }

我是否需要分别编写这样的端点和服务类

 getClientCompanyAccounts(clientCompanyId: number) {
        return this.clientEndpoint.getClientCompanyAccountsEndpoint(clientCompanyId);
    }

    public getClientCompanyAccountsEndpoint(clientCompanyId: number): Observable<AccountModel[]> {
        const url = this._baseUrl + this._clientCompanyAccountsUrl + clientCompanyId;
        return this.http.get<AccountModel[]>(url, this.getRequestHeaders())
        .pipe(catchError(error => {
            return this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId));
        }));
    }

 getClientCompanyAccounts(clientCompanyId: number){
        return this._addAccountEndpoint.getClientCompanyAccountsEndpoint(clientCompanyId);
    }

public getClientCompanyAccountsEndpoint(clientCompanyId: number): Observable<SettlementAccountModel[]> {
        return this.http.get<SettlementAccountModel[]>(this._clientCompanyAccountsUrl + clientCompanyId, this.getRequestHeaders())
            .pipe(catchError(error => {
                return this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId));
            }));
    }

Answer 1

我建议按如下所示捕获错误。

public getClientCompanyAccountsEndpoint<T>(clientCompanyId: number): Observable<T> {
    const url = this._baseUrl + this._clientCompanyAccountsUrl + clientCompanyId;

    return this.http.get<T>(url, this.getRequestHeaders())
    .pipe(tap(_ => {}, err => this.handleError(error, () => this.getClientCompanyAccountsEndpoint(clientCompanyId))));
}

因为如果使用catchError，它会返回一个可观察到的错误响应...因此，可以说您有以下schenario-您想在某个地方记录错误，或者显示toastr或其他内容，然后再在使用该服务的组件中使用还要处理错误，如果您事先捕获了Error，则将无法处理组件中的错误响应。即

myService.getClientCompanyAccountsEndpoint().subscribe(res => (), err => (
// Will never be reached because error will be in res callback
))

点击操作符定义为

tap({
  next: val => {
    // on next 11, etc.
    console.log('on next', val);
  },
  error: error => {
    console.log('on error', error.message);
  },
  complete: () => console.log('on complete')
})

类型“未知”不可分配给类型“ T”

1 个答案: