如何从异步函数调用组件方法？

Question

我的代码：

export class TestComponent implements OnInit {

  constructor() { }

  ngOnInit() {
    FB.getLoginStatus(function (response) {
      this.ParseFacebookLoginStatus(response);
    });
  }

  ParseFacebookLoginStatus(response) {
    console.log(response.status);
  }

我的控制台正在输出ERROR TypeError: this.ParseFacebookLoginStatus is not a function。

我只是在这里猜测getLoginStatus是异步的，并且这在结果上下文中不是我的TestComponent吗？如何通过适当的回调返回我的TestComponent？

Answer 1

使用箭头功能代替

之类的关键字function

FB.getLoginStatus((response)=>{ 

或将this保存在变量中，并在调用this之前使用它代替FB.getLoginStatus，例如：

ngOnInit() {
  let $this = this;
  FB.getLoginStatus(function (response) {
    $this.ParseFacebookLoginStatus(response);
  });
}

否则，关键字this不是指组件，而是指新功能。

因此问题与async或sync无关，而与this的上下文有关。