Angular 2 方法没有订阅 observable

Posted 2023-03-13

【中文标题】Angular 2 方法没有订阅 observable

【英文标题】：Angular 2 method is not subscribing to the observable

【发布时间】：2017-03-24 11:38:40

【问题描述】：

我正在尝试使用服务类获取 JSON 数据。 服务类

import  Injectable      from '@angular/core';
import  Http, HttpModule, Response  from '@angular/http';
import  GeneralTab      from './generalTab';
import 'rxjs/Rx';
import  Observable      from 'rxjs/Observable';


@Injectable()
export class GeneralTabService 
     constructor(private _http : Http) 

        console.log("Http call");
    

   getStatus(): Observable<any>  
    return      this._http.get('http://samd.server.lan.at/taskmanagement/rest/taskconfigs/IND?language=EN&access_token=200')
         .map((res:Response) => <GeneralTab[]>res.json())
         .do(data => console.log("All: " +  JSON.stringify(data)))
         .catch(this.handleError);


  private handleError (error: any) 
    
    let errMsg = (error.message) ? error.message :
        error.status ? `$error.status - $error.statusText` : 'Server error';
        return Observable.throw(errMsg);
  

组件类

import  Component, OnInit  from '@angular/core';
import GeneralTab from "./generalTab";
import GeneralTabService from "./generalTab.service";
import  Observable  from 'rxjs/Observable';

    @Component(
        selector: 'general-tab',
        templateUrl: '/general.component.html',
        providers : [GeneralTabService]

    )

    export class GeneralComponent implements OnInit
        title = 'Serving data from General Component';

        errorMessage: any;
        status: GeneralTab [];
        mode = 'Observable';

        constructor (private generalService: GeneralTabService) 
            this.status = [];
        

        ngOnInit() 
            console.log("Started");
            this.generalService.getStatus().subscribe(
                (status: any) => this.status = status,
                (error: any) =>  this.errorMessage = error
            );
            console.log(this.status);
        

    

GeneralTab 类

export class GeneralTab 

    constructor(public recipientId : string,
    public recipientName: string,
    public recipientFullname: string,
    public ouId:String,
    public ouName:String,
    public institute:number,
    public shortName:String,
    public status:String)
    
    

我在控制台中看到 .do(data => console.log("All:" +  JSON.stringify(data))) 正在获取 JSON 数据，例如

"subjectsConfig":["subject":"客户数据维护","preselected":false,"initialDueDate":"2016-11-24","actionConfigs":["action":"SEND ","re​​cipients":["user":"recipientId":"BD27A4F5923FCA13","re​​cipientName":"ABTABT","re​​cipientFullname":"ABTABT","ouId":"BD27A4F5923FCA13","ouName":" 0015",....

订阅未将任何数据分配给状态数组，我得到空白的“状态”数组。我希望这些数据作为状态变量中的数组用于测试目的。如何获得？

【参考方案1】：

如果你像

这样记录响应

 console.log("Started");
 this.generalService.getStatus().subscribe(
         (status: any) => this.status = status,
         (error: any) =>  this.errorMessage = error
 );
 console.log(this.status);

当然你会看到一个空白状态，因为上面的代码（getStatus().subscribe）是异步的。这意味着您正在发出请求，然后您正在等待subscribe 内部的响应，当它到来时，您会将status 分配给this.status。在等待时，您已经在记录（this.status），它最初是空白的。

试试这个并检查日志，

 console.log("Started");
 this.generalService.getStatus().subscribe(
       (status: any) => 
            this.status = status;
            console.log(this.status);
       ,
       (error: any) =>  this.errorMessage = error
 );