Angular 无法在subscribe函数中设置全局变量

Angular 无法在subscribe函数中设置全局变量,angular,typescript,Angular,Typescript,我想在变量中设置服务响应,以便在视图中使用,我的TS文件如下 MenuService是自定义服务,geMenus()是从数据库中获取所有菜单的函数 import { Component, OnInit } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; import { MenusService } from '../menus.service'; @Component({ sel

我想在变量中设置服务响应,以便在视图中使用,我的TS文件如下

MenuService是自定义服务,geMenus()是从数据库中获取所有菜单的函数

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中设置primaryMenu,observable是异步的。您将第二个
console.log()
放在订阅之外。在那里,它在可观察对象返回值之前很久就被处理了。只能这样做:

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.
你的代码

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
这是订阅的基本性质。在完成所有同步代码后,将执行回调

修理 仅在调用subscribe后使用该值

在菜单服务中

/**
     * Method is used to get data
     * 
     */
    getMenus():  Observable<any> {
        this.requestURL = `url`;
        return this.http.get(this.requestURL);
    }

这只是因为在外部控制台日志执行之后,您从服务得到的响应。所以在那个时候,它是未定义的。 如果只想在收到响应时执行/显示某些操作,最好在subscribe方法中调用函数

  getMenu(){
    this._ser.getMenus().subscribe(res=>{
          this.primeryMenus = res;
          this.doSomething();
});

doSomething() {
   console.log(this.primeryMenus);
  // Do something awesome
}

subscribe是异步操作,所以最后一个console.log是excute first您会遇到什么样的错误?很高兴在这里见到您@basarat先生
  getMenu(){
    this._ser.getMenus().subscribe(res=>{
          this.primeryMenus = res;
          this.doSomething();
});

doSomething() {
   console.log(this.primeryMenus);
  // Do something awesome
}