Angular 2. Http。订阅：“这个”指针

Posted 2021-05-07

拿到：

http.request('js/app/config/config.json').subscribe(data => {
            this.url = data.json().url;
        });

并以某种方式“这”指向订阅者。不知道为什么......因为我认为fat-arrow lambda会捕获父类的指针。

为什么这样？

答案

根据截图：http://d.pr/i/iBa

您正在控制台中调试this。请注意，控制台上的this将是实际的。当TypeScript为非ES6 javascript（没有箭头函数的原生支持）生成箭头函数时，this被映射到_this（以及其他东西），这意味着您需要查看_this。

TIP

在学习TypeScript时只需调试生成的JavaScript。这是TypeScript错误：https://github.com/Microsoft/TypeScript/issues/2859如果你有兴趣。

另一答案

我找到了一个解决方法，你可以试试这个

http.request('js/app/config/config.json').subscribe((function (data) {
  this.url = data.json().url;
}).bind(this));

另一答案

箭头函数没有自己的this值。箭头函数中this的值始终从封闭范围继承，在您的情况下为Subscriber。

在ES6版本中，请注意subscribe方法从其调用者接收this。内部函数是一个箭头函数，因此它从封闭范围继承this。

另一答案

这是ES6箭头函数功能，以避免为上下文创建另一个变量。你无法覆盖箭头功能的“这个”。

http.request('js/app/config/config.json').subscribe(function(data) {
  this.url = data.json().url;
});

请参阅此文档：http://derickbailey.com/2015/09/28/do-es6-arrow-functions-really-solve-this-in-javascript/