Angular HttpClient,动态设置地图类型

时间:2019-02-15 18:12:45

标签: javascript angular typescript angular-httpclient

我在服务上有一个方法可以处理所有后端请求。与其使用HttpClient编写大量不同的调用,我还想写一个可以连接到后端并传递参数以处理不同类型数据的函数。

考虑此功能

public postRequest(token: string, url: string, body: any, headers: Object = {}) : Observable<any> {
//create new header object
const httpOptions = {
  headers: new HttpHeaders()
    .set('Authorization', token)
};
//add the headers if any
for(let index in headers){
  httpOptions.headers.set(index, headers[index]);
}
//connect to the backend and return the repsonse
return this.http.post( this.config.BASE_SERVER_URL + url, body , httpOptions)
  .pipe(
    map((res) => {
      return res;
    }),
    catchError(this.handleError)
  );
}

它工作得很好,除了我希望能够动态设置响应类型。因此,我可以将方法设置为使用我的一种模型类型。

这就是我要完成的任务。希望这是有道理的。

map(res: "Attendee") => {}
//or
map(res: typeof(typeInput)) => {}

是否可以在http map方法中使用“动态”类型,以便将不同的响应映射到我选择的模型?

1 个答案:

答案 0 :(得分:1)

我可以使用通用方法来实现。

您可以使用这种方法。

  

my-own.service.ts

userAuthentication<T>(userName: string, password: string): Observable<T> {
    const url = `http://my-own.url`;
    const targetData = {
      'emailId': userName,
      'password': password
    };
    return this.http.post<CommonResponse<T>>(url, targetData, httpOptions).pipe(
      retry(3),
      map((data: CommonResponse<T>) => {
        if (data.status) {
          if (!data.result[0]) {
            this.showMessage('You are not authorized for login');
            return null;
          }
          return data.result[0] as T;
        }
        this.showMessage(data.message);
        return null;
      }),
      tap((userProfile: T) => {
        console.log('UserLogin ');
      }),
      catchError(this.handleError<T>('unable to logged in')));
  }
  

CommonResponse模型

export class CommonResponse<T> {
  autherizationExpires: string;
  autherizationKey: string;
  message: string;
  result: T | T[];
  status: boolean;
}

因此,当您调用 myOwnService.userAuthentication (... params).subscribe(/ *您的代码* /); 之类的方法时, 它也会继承到地图。

如果我没有收到您的问题,请告诉我。