无缘无故的“_this.http 未定义”答案

【问题标题】："_this.http is undefined" for no reason无缘无故的“_this.http 未定义”
【发布时间】：2018-04-10 12:40:32
【问题描述】：

在我的 LoginProvider 中，我使用了一个执行登录并将创建的会话作为承诺返回的函数。

@Injectable()
export class LoginProvider {

    constructor(public http: HttpClient) { };

    public async login(credentials: ICredentials): Promise<ISession> {

        let url: string = "https:/url/to/login";

        let headers: HttpHeaders = new HttpHeaders()

        let params: HttpParams = new HttpParams()
            .append("username", credentials.id)
            .append("password", credentials.password);

        return new Promise<ISession>((resolve, reject) => {
            this.http.get(url, { headers: headers, params: params }).subscribe((response: ILoginResponse) => {
                // handle response and return session
            }, (error: HttpErrorResponse) => {
                reject(error);
            })
        });
    }
}

问题是this.http 在调用它时不知何故。调用该方法时出现如下错误。

"_this.http is undefined"

我不知道为什么 http 应该在这个函数中未定义。我在构造函数中创建它，所以它应该可以用于这个函数，不是吗？

【问题讨论】：

有一点需要注意，它是@Injectable()
我猜“this”指的是另一个范围，而不是您的 LoginProvider。另外，为什么不使用 rxjs 代替 Promise？
因为我可以在我喜欢使用的 Promises 上使用await。或者有其他选择吗？是的，我猜这里的范围存在一些问题。
你真的应该接受 Davy 的建议，使用 Observable 而不是承诺。我建议看这个codecraft.tv/courses/angular/http/http-with-observables（promise 版本在之前的课程中显示）
你是怎么调用login函数的？

标签： angular typescript http ionic-framework

【解决方案1】：

new Promise 内部的this 指的是新的Promise 对象，而不是LoginProvider 实例。

所以，不要这样做

new Promise<ISession>((resolve, reject) => {
    this.http.get(...)
})

你应该简单

return this.http.get(url, { headers: headers, params: params}).toPromise()
  .then(response => // handle your response here then return your processed result);

(别忘了导入'rxjs/add/operator/toPromise';)

【讨论】：

避免创建无意义的承诺的好建议，但您对 this 的看法不正确。箭头函数绑定到词法范围