修复

Question

我想在变量中设置服务响应以用于查看我的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);
  }


}

如何在可观察的订阅中设置primaryMenu

Answer 1

您的代码

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

这是订阅的基本性质。回调在所有同步代码完成后之后执行。

修复

在调用订阅后使用值 only 。

Answer 2

可观察对象是异步的。您将第二个Could not get any response: There was an error connecting to http://127.0.0.1:5000/sync/api/v1.0/users.放在了订阅之外。在Observable返回值之前很久就在那里进行处理。仅通过以下方式进行操作：

console.log()

Answer 3

在MenusService中

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

在Header1Component中：

getMenu(){
    this._ser.getMenus().subscribe((res: any)=> {
      this.primeryMenus = res;
      console.log(this.primeryMenus);
    });
    console.log(this.primeryMenus) ;
  }

Answer 4

这仅仅是因为您在外部控制台日志执行之后的后从服务获得响应。因此，当时它显示为undefined。如果仅在收到响应后才想做/显示某事，最好在subscribe方法中调用一个函数。

getMenu(){ this._ser.getMenus().subscribe(res=>{ this.primeryMenus = res; this.doSomething(); }); doSomething() { console.log(this.primeryMenus); // Do something awesome }

无法在订阅函数中设置全局变量

4 个答案:

修复