Question

试图从Web Api获取数据数组。当我第一次调用api时，结果返回指示未定义。得到预期结果之后的任何呼叫。

调用方法将结果存储到工作站

@Injectable()
export class StationService {

    private stations;
    constructor(private webservice: WebService) { }

    Oncall() {
        this.webservice.GetData('Search/GetStations').subscribe((respons: Station[]) => { this.stations = respons; });
        console.log(this.stations);
        console.log('----------------------------------');
    }
}

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Station } from '../dataModels/stationModel';
import { map } from 'rxjs/operators';

@Injectable()
export class WebService {
    private url = 'http://localhost:11835/Api/';

    constructor(private http: HttpClient) { }

    GetData(path: string) {
        return this.http.get<Station[]>((this.url + path)).pipe(
            map((data: Station[]) => data)
        );
    }
}

谢谢

Answer 1

更改代码：

    Oncall() {
        this.webservice.GetData('Search/GetStations').subscribe((respons: Station[]) => { 
         this.stations = respons;
         console.log(this.stations);
         console.log('----------------------------------');
        });

    }

问题在于，第一次调用服务函数（GetData）需要一段时间才能获取数据，并且您正在运行console.log（this.stations）；后。您的那部分代码异步运行，并且无需等待分配完成。stations= respons;

下次调用它时，它将显示以前的值

Answer 2

您的控制台日志不在分配范围内。在数据有机会返回之前，您正在尝试记录所看到的对象（如果未定义）。当您第二次点击它时，已经从第一次调用中检索了数据，这就是为什么要进行记录，但是如果您对数据进行了任何更改，您可能会注意到该数据是陈旧的。

如果您想在最初获取数据后查看console.log，则将控制台日志添加到将数据分配给对象的位置。

Oncall() {
        this.webservice.GetData('Search/GetStations').subscribe((respons: Station[]) => { 
         this.stations = respons;
         console.log(this.stations);
        });
    }

Answer 3

您的console.log代码是同步发生的，因为您的代码超出了您的订阅函数的范围，因此它返回的是未定义的。但是，此后，异步代码立即解析并将“ this.stations”设置为响应。因此，您总是在查看后面一个Web请求的结果。

Leonardo建议的更改将导致日志在http请求解决后发生

从Web API获取数据时，获取结果对象为unfine。仅在首次通话中

3 个答案: