angular - subscribe fonksiyonunda global değişkeni ayarlayamıyor

Servis yanıtını bir değişkende saklamak ve view'de kullanmak istiyorum. TypeScript dosyam aşağıdaki gibi.

MenuService özel bir servistir ve geMenus() veritabanından tüm menüleri getirmek için kullanılan bir fonksiyondur

import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { MenusService } from '../menus.service'; 

@Component({
  selector: 'app-header1',
  templateUrl: './header1.component.html',
  styleUrls: ['./header1.component.css'],
  providers:[MenusService]
})
export class Header1Component implements OnInit {

  menus=['Login','Register','Subscribe'];
  primeryMenus:any; 
  //menus1=['Home','Matches','Players','Teams','Tournaments','Contact Us','About Us'];
   constructor(private translate: TranslateService,private _ser:MenusService) {
    translate.setDefaultLang('en');
  }

  ngOnInit(){
    this.getMenu();
  }
  getMenu(){
    this._ser.getMenus().subscribe(res=>{
      this.primeryMenus = res;
      console.log(this.primeryMenus) // output is json object ( getting correct output )
    });
    console.log(this.primeryMenus) // output is undefined

  }

  switchLanguage(language: string) {
    this.translate.use(language);
  }


}

subscribe observable içinde primaryMenu nasıl ayarlanır

Cevap #1

Kodunuz

this._ser.getMenus().subscribe(res=>{
  this.primeryMenus = res;
  console.log(this.primeryMenus) // output is json object ( getting correct output )
});
console.log(this.primeryMenus) // output is undefined

Bu, subscribe'ın temel doğasıdır. Geri çağırma, tüm senkron kod tamamlandıktan sonra çalıştırılır.

Düzelt

Değeri yalnızca subscribe çağrıldıktan sonra kullanın.

Cevap #2

Observables asenkron çalışır. İkinci console.log() ifadesini aboneliğin dışında koyuyorsunuz. Orada, Observable bir değer döndürmeden çok önce işlenir. Bunu sadece şu şekilde yapın:

getMenu(){
    this._ser.getMenus().subscribe(res=>{
          this.primeryMenus = res;
          console.log(this.primeryMenus) // output is json object ( getting correct output )
});

// never put a console(log) here if you want to see the return value of the observable above as it processed long before the Observable returns a value.

İlgili makaleler