首页 > 解决方案 > 在泛型方法上使用标头时需要创建自定义 Observable

问题描述

我已经创建了一个像这样的通用服务。

common.ts

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class CommonService {

  constructor(private http: HttpClient) { }

  post(url: string, params: any): Observable<any> {
    return new Observable(observer => {
      const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded' }) };
      this.http.post(url, params, httpOptions)
        .subscribe(response => {
          observer.next(response);
          observer.complete();
        }, (err) => {
          observer.error(err);
        });
    });
  }
}

我的服务.ts

 book(data: Spa): Observable<any> {
    return this.commonService.post(`${environment.apiURL}/my/v3/my.json`, data);
  }

页面.ts

  book() {
     this.myService.book(spa).subscribe((res: any) => {
      }, error => { console.log(error); });
     }
  }

问:我需要创建自定义Observableonpost()方法吗?既然this.http.post(url, params, httpOptions)返回Observable希望我不需要Observable再次创建自定义(即common.ts)?

注意:以上工作正常,但没有错误。

标签: angulartypescriptrxjsangular7ionic4

解决方案


函数 post 返回一个 observable ,如果你想要它可以输入,那么你不需要创建另一个 observable ,你可以简化如下:

post(url: string, params: any): Observable<any> {
   const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded' }) };
   return this.http.post(url, params, httpOptions);
}

推荐阅读