angular http client 全局使用

Question

我最近使用typescript封装一个关于微信的Api(微信登录，获取微信用户信息等)，如下的代码，我遇到的问题是怎么全局使用angular的HttpClient

import {HttpClient} from '@angular/common/http';

class ErrorCode {
  code: string;
  msg: string;
}

class WeChatResponseInfo extends ErrorCode {
  openId: string;
  accessToken: string;
  refreshToken: string;
  scope: string;
}

class WeChatUserDetails extends ErrorCode {
  unionId: string;
  nickname: string;
  sex: number;
  openId: string;
  city: string;
  headImgUrl: string;
}

interface WeChatRequestInfo {
    appId: string;
    secret: string;
    code: string;
}


export function sendRequest(): WeChatResponseInfo {
  return null;
}

export class WeChatSdk {
      constructor(private http: HttpClient) {

      }
}

现在我在构造函数里面注入httpclient了，但是在外面的函数却无法使用，在外面不知道怎么实例化httpclient，
我是一个angular新手

Answer 1

你应该把WeChatSdk 注解为一个angular服务，然后，sendRequest作为WeChatSdk的一个方法。所有要调用sendRequest的地方都先用依赖注入WeChatSdk服务，这样你才能可靠的得到HttpClient。

import {HttpClient} from '@angular/common/http';

class ErrorCode {
  code: string;
  msg: string;
}

class WeChatResponseInfo extends ErrorCode {
  openId: string;
  accessToken: string;
  refreshToken: string;
  scope: string;
}

class WeChatUserDetails extends ErrorCode {
  unionId: string;
  nickname: string;
  sex: number;
  openId: string;
  city: string;
  headImgUrl: string;
}

interface WeChatRequestInfo {
    appId: string;
    secret: string;
    code: string;
}


@Injectable()//把WeChatSdk注解为angular服务
export class WeChatSdk {
      constructor(private http: HttpClient) {

      }
      
      sendRequest(): WeChatResponseInfo {
        this.http.post(...)
        return null;
        }
      
}