Question

我是角色并使用angular 2 with typescript的新手，并且在将值放入变量时存在问题。

此外，我还看到了关于let的打字稿文档以及阻止范围： https://www.typescriptlang.org/docs/handbook/variable-declarations.html

但问题可能是third log在second log之前调用，这是一个调用服务器的ajax请求。

这是我使用let的代码：

getData() {
    let value : any;
    console.log('first console log:'+value);
    this.http
        .get('api/get')
        .map(response => response.json())
        .subscribe(response => {
            value = response;
            console.log('second console log:'+value);
        });
    console.log('third console log:'+value);
}

输出是：

first console log:undefined
third console log:undefined
second console log:[object Object]

如何获得变量的响应值？

Answer 1

您的ajax调用是异步的。所以.subscribe()将在ajax调用解决后到达。您的第三个console.log位于主应用程序流中，并将在另一个线程上触发ajax调用后直接执行。因此，您的价值尚未启动。

如果您使用回调编写此代码，可能会更清楚会发生什么：

getData() {
  let value : any;
  this.http.get('api/get', (res, err) => {
    value = res;
    console.log('second console log:' + value);
  });
  console.log('third console log:' + value);
}

没有Rx的解决方案是使用promises

getData() {
  let value : any;
  this.http.get('api/get')
    .then(res => {
      value = res;
      console.log('second console log:' + value);
    });
  console.log('third console log:' + value);
}

但是你必须意识到隐藏回调并为你提供可链接的.then()语法只是语法。

真正的问题是第三个控制台行位于主线程上（当您输入getData()函数时），异步代码将被安排在不同的线程上以按自己的节奏运行。因此第三个控制台日志永远不会与该代码对齐。

修复方法是将第三个控制台日志行添加到.subscribe()，.then()或回调您选择的任何路径。

如何在父函数范围内获得异步调用的结果

1 个答案: