Angular2：在回调函数中调用其他函数答案

【问题标题】：Angular2: Calling other functions inside call back functionsAngular2：在回调函数中调用其他函数
【发布时间】：2016-06-21 08:41:35
【问题描述】：

我正在构建一个 Angular2 应用程序。我在myService 中有一个异步函数deleteObject。它返回一个承诺。我在组件中有另一个名为refresh 的函数，用于刷新页面。我如何从 Promise 内部调用刷新。这是我尝试过的：

export class AppComponent{

    refresh(){
        // refresh page here
    }

    delete(){
        this.myService.deleteObject(params).then(
           function(data){
             //this.refresh() doesn't work here.
        });
    }
}

【问题讨论】：

标签： javascript asynchronous angular asynccallback

【解决方案1】：

如果您使用 Typescript 进行编码，则可以改用 fat arrow functions。他们保留了您所期望的this 上下文。所以替换

delete(){
        this.myService.deleteObject(params).then(
           function(data){
             //this.refresh() doesn't work here.
        });
}

有了这个：

delete(){
    this.myService.deleteObject(params).then(
            (data)=>{
                //this.refresh() should work here
            }
    );
}

【讨论】：

谢谢帕特里克。对于 Typescript，我认为这是正确的答案。 :)

【解决方案2】：

这是一个上下文问题。 “this”指的是回调函数的上下文，可以是promise什么的。你真正想要的是对组件上下文的引用，你可以这样实现

delete(){
    var componentRef = this; // colloquially "that" or "self"
    this.myService.deleteObject(params).then(
       function(data){
         componentRef.refresh() // does work here.
    });
}

【讨论】：

另外，你可以查看rxjs observables，这是一个强大的角度范式（技术上是 rxjs 范式，但它们合并了它）
谢谢@kirinthos。我是 Javascript 新手。它对我有用。 :)
@UnderWood 我可以建议给closures 阅读
感谢@kirinthos。我去看看。