变量不能分配从订阅方法

Question

在本身显示值的方法，但外面它显示未定义消息

Ubigeo.service.ts

lisProvinciaByDepartamento(ubigeoId: string): Observable<Ubigeo[]> { 
    let ubigeo$ = this.http 
    .get(`${this.baseUrl}/provincia/${ubigeoId}`, {headers: this.getHeaders()}) 
    .map(mapUbigeos) 
    .catch(handleError); 
    return ubigeo$; 
} 

Detail.component.ts

cargaPronvicia(ubigeoId: string) { 
    this._ubigeoService 
     .lisProvinciaByDepartamento(ubigeoId) 
     .subscribe((p) => { 
      this.provinciaSeleccionada = p 
       .find(item => 
        item.ubigeoId.substr(2, 2) === ubigeoId.substr(2, 2)); 
      this.provincias = p; 
      console.log(this.provinciaSeleccionada); //2 
     }); 

    console.log(this.provinciaSeleccionada); //1 
} 

undefined in console

Answer 1

这是因为数据检索是相对的async当你使用它作为observalbes。 如果是空的，所以永远不要直接使用变量，

良好做法

1. 跳过订阅。

   cargaPronvicia(ubigeoId: string) { 
       this._ubigeoService 
       .lisProvinciaByDepartamento(ubigeoId) 
       //////////////////////////////////////////////////////////////// 
       .skipWhile((p) => p === undefined) 
       //////////////////////////////////////////////////////////////// 
       .subscribe((p) => { 
        this.provinciaSeleccionada = p 
         .find(item => 
          item.ubigeoId.substr(2, 2) === ubigeoId.substr(2, 2)); 
        this.provincias = p; 
        console.log(this.provinciaSeleccionada); //2 
       }); 
   
   console.log(this.provinciaSeleccionada); //1 
   } 
   

2. 你在哪里都使用的是订阅的变量，检查它是否包含数据，你的情况的一个例子是

   if(this.provinciaSeleccionada){ 
       console.log(this.provinciaSeleccionada); 
   } 
   

更新1：

• 使用承诺最关心，理由是当您使用p在构造函数中放弃，在解决承诺之前，组件不会加载。
  • 通过这种速度的应用程序将如预期。
  • Angular2的反应性没有被利用。