Question

我试图从响应中获取数据，但我似乎无法得到我想要的结果。

facebookLogin(): void {

    this.fb.login()
        .then((res: LoginResponse) => {
            this.accessToken = res.authResponse.accessToken;
            this.expiresIn = res.authResponse.expiresIn;
            this.signedRequest = res.authResponse.signedRequest;
            this.userId = res.authResponse.userID;
            console.log('Logged In', res, this.accessToken); //works without problem 
            this.router.navigate(['../other-register']);
        })
        .catch(this.handleError);

    console.log(this.accessToken) //printing 'undefined'
}

在then => { }内，console.log似乎在res中打印数据没有任何问题。我可以看到我想要的数据但是当我console.log之外的then =>{ }时，它会给我未定义的内容。

我做错了什么？我需要在响应中使用数据并将它们传递给其他组件，但我似乎无法弄清楚我做错了什么。

任何人都可以帮助我吗？感谢

Answer 1

这实际上是预期的行为。

regionOfInterest是一个承诺。这意味着结果/响应（res）的值在调用时不会立即可用，但它“承诺”一旦采取某些操作或返回响应并且“然后”它将具有值会做点什么。在这种情况下，该操作将连接到Facebook API并返回数据。这就像jQuery中的Ajax，如果你有经验，Promises是一个更加进化的回调版本。

正在发生的是您正在按此顺序执行功能：

this.fb.login()被调用。没有值，所以它允许脚本继续。
this.fb.login()被召唤。
返回this.fb.login的值，并执行console.log()闭包。

如果您想知道值何时返回或者在返回后执行特定操作，您可以调用then()中的函数或查看observables（RxJS）以通知您的应用程序的其他部分登录是成功（或不成功）。

Observables示例

这是关于Observables的一个例子，但是，我会做更多的研究，因为有多个主题可供选择，所有主题的行为都略有不同。此外，如果在服务中执行此类模式，这种模式在Angular2 +中效果更好，这样其他组件就能够访问Facebook提供的信息。

.then()

然后，您可以在import { AsyncSubject } from 'rxjs/AsyncSubject'; // ... response: AsyncSubject<any> = new AsyncSubject(); facebookLogin(): void { this.fb.login() .then((res: LoginResponse) => { this.response.next(res); this.response.complete(); this.router.navigate(['../other-register']); }) .catch(this.handleError); }内检索数据：

response

传递数据示例

由于您已经在用于接收数据的服务中拥有一项功能，因此在您的情况下这可能是更明智的实现。

this.response.subscribe(result => {
    console.log(result);
})

Angular2无法使用promise从响应中获取数据？

1 个答案: