Angular '；这'；在订阅中未定义

我有一个subscribe语句，我试图调试它，但是当我在VS代码中单步执行时，“this”在语句中总是未定义的。在这种情况下，“this.dataLoaded”是未定义的。调试时如何使其不被未定义

this.router.events
            .filter(event => (event instanceof NavigationEnd))
                .subscribe((routeData: any) => {                        
                    if(!this.dataLoaded){
                      ...
                    }
                });  

---

请查看调试器

变量

选项卡中的

关闭

展开部分。您真正的

此

将比最顶层高一级，其中

此

指的是组件控制器名称。每个匿名函数都会创建额外的闭包，在您的示例中，它包含在

subscribe

中，并且当遇到断点时，VS code将默认打开此闭包

---

请尽量避免这种老式的JS黑客攻击

let that=this

e.c.t，因为当您使用TypeScript、类、ES6和arrow函数时，就不再需要这些黑客攻击了。

当您使用

.subscribe（）

时，从角度看，它可能无法获得

此
。在我的例子中，我使用了这个的另一个复制品。这对我总是有用的。它可能也适合你

var that = this; // Hear I store the this ref into another that
this.router.events
        .filter(event => (event instanceof NavigationEnd))
            .subscribe((routeData: any) => {                        
                if(!that.dataLoaded){  // Hear you can use that instead of this
                  ...
                }
            }); 

作为一个接近于从被接受的答案中实现
that=this
路线的人，请保存自己，并查看托马斯所写的答案。如果可能的话，花一些额外的时间在上面并避免使用javascript黑客是很好的

有关使用箭头函数保持
此
上下文的示例，请参见下文

这是我最初拥有的代码，它丢失了
This
上下文：

this.settingsService.getClientSettingsByCategory(clientId, categoryId)
    .subscribe(
        this.loadJobStatusReport
    );

this.settingsService.getClientSettingsByCategory(clientId, categoryId)
    .subscribe(
        settings => this.loadJobStatusReport(settings)
    );

这是更新后的代码，它保留了预期的
此
上下文：

this.settingsService.getClientSettingsByCategory(clientId, categoryId)
    .subscribe(
        this.loadJobStatusReport
    );

this.settingsService.getClientSettingsByCategory(clientId, categoryId)
    .subscribe(
        settings => this.loadJobStatusReport(settings)
    );

我不确定这是不是个好主意。我是初学者。但是您可以使用
.bind（this）
方法

以下是一个角度ts示例：

this.myService.getData().subscribe((data=>{
    this.doSomething(data);
    alert(this.somethingElse);
}).bind(this));

你可以展示周围的代码，或者链接到stackblitz和完整的解决方案吗？这里没有什么事情发生。很可能是在传输过程中被重写成了
\u this
或类似的东西。查看调试界面的“本地”或“范围”部分，并在范围中查找其他项。Hi Terrance是正常的，因为您处于this（这是事件）而不是全局范围。请尝试this const me=this，在this.router之外，然后！我dataLoaded@AmericoArvani没有本地
此
，因为
订阅
正在使用箭头函数。只有在调试时才更正未定义的本地。如果代码只是运行，它就可以正常工作。我只需要知道在调试时是否有一种方法可以看到订阅中的本地“this”@Daniel Giminez没有周围的代码。这可能是一个面试问题有一天我偶然发现了这个问题，你能解释一下原因吗？请看下面我的堆栈溢出的回答-这/这不再是推荐的route@ParsaGachkar答案应该是可以接受的。正如我的堆栈溢出所回答的，现在有一个更好的方法使用箭头函数来实现这一点。这是目前解决此问题的最佳方法。您传递的设置是什么？我们的“getClientSettingsByCategory”方法的返回值。这是一组“设置”对象。完美-这很有意义。谢谢你说得很清楚，特别是在那次辩论中。