Angular 4-5 HttpClient http get 的强类型

标签 angular typescript

我使用帮助程序服务来简化 httpClient 调用。我想对返回的 Observable 进行强类型化。

我的服务,我使用 api 服务并尝试获取发出 > 的强类型可观察对象。

export class ApiUser(){
  constructor(private api: Api){}

  getUsers(url? : string): Observable<Array<User>>{
    return this.api.get<Array<User>>('users'); //here I get errors on types.
  }
}

我的 api 帮助器服务,应传递类型:

    import { HttpClient, HttpParams } from '@angular/common/http';
    import { Injectable } from '@angular/core';
    import {Observable} from "rxjs/Observable";
    import {User} from "../../interfaces/interfaces";

    /**
     * Api is a generic REST Api handler.
     */
    @Injectable()
    export class ApiService {
      constructor(public http: HttpClient) {}

      get(endpoint: string, params?: any, reqOpts?: any){
       
        return this.http.get('https://sub.domain.com/api/v1/' + 
     endpoint,reqOpts);
      }
    }

所以问题是,这可能不是强类型的正确方法,如果我在 api 帮助程序服务中输入 this.http.get ,它就会起作用,但这违背了强类型的目的帮助服务。

最佳答案

您需要提供type variable给您ApiService.get函数,因为 HttpClient.get假设标准Object当未提供类型时。为此,您可以更新 ApiService.get使用这样的类型变量(例如 T ),如下所示:

get<T>(endpoint: string, params?: any, reqOpts?: any) {
    return this.http.get<T>('https://sub.domain.com/api/v1/' + 
         endpoint,reqOpts);
}

请注意您指定 <T>既作为函数声明 ( get<T> ) 的一部分,又作为传递到 HttpClient.get 的参数.

关于Angular 4-5 HttpClient http get 的强类型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47754232/

相关文章:

html - 在不同宽度的图像上将 Div 定位在同一位置

javascript - Angular 2 - Http 测试 - 错误 : "Cannot read property ' getCookie' of null"

javascript - TypeScript 和无服务器 : `this` Undefined When Calling Private Methods from Public Methods

javascript - 将 lawnchair 与 Typescript 结合使用

javascript - 如何将按钮单击去抖动延迟转换为文本框按键延迟?

angular - 如何有条件地移除包装 div 并保留其子级?

angular - 如何将 AppInsights 与 Angular 结合使用?

angular - ngModel 不显示该值

TypeScript Set<> 集合通过索引获取值

typescript :如何制作一个作为接口(interface)键的类型,但只有作为字符串的键