代码之家 › 专栏 › 技术社区 › user8512043

将数据从一个函数分配给另一个函数

angular8 typescript angular

user8512043 · 技术社区 · 3 年前

我正在使用中的服务检索数据库数据 TypeScript

parentMenu: any[] = []; //Global var

LoadParentMenu() {
   this.menuService.getParentMenu().subscribe(result => this.parentMenu = result); //Assigning value here
}

LoadChildMenu() {
   console.log(this.parentMenu); //Willing to use the global variable in the second function
}

LoadParentMenu() {
   this.LoadChildMenu(result); //Passing data in the second function
}

但我的要求是从两个服务中获取数据,将它们绑定到一个全局数组变量,最后在另一个方法中使用它们(实际上是第三个方法)。我试着这样做,结果是在控制台中:

parentMenu: any[] = []; //Global var 1
childMenu: any[] = []; //Global var 2

LoadParentMenu() {
   this.menuService.getParentMenu().subscribe(result => this.parentMenu = result); //Assigning value here
}

LoadChildMenu() {
   this.menuService.getParentMenu().subscribe(result => this.childMenu = result); //Assigning value here
}

LoadThirdFunc() {
   console.log(this.parentMenu);
   console.log(this.childMenu);
}

在第三个函数中,我需要通过两个全局变量进行如下更改:

const mergeById = (array1, array2) =>
array1.map(parent => ({
  ...parent,
  childMenu: array2.filter((child) => child && (child.parentMenu === parent.menuNo))
    .map(child => child && child.menuName)
}));

var result = mergeById(array1, array2)
  .filter(x => x.childMenu && x.childMenu.length > 0);

0 回复 | 直到 3 年前

Danish Dullu 3 年前

它返回undefined,因为typescript在控制台中逐行执行。在从服务器获取数据之前调用日志。您可以将这两个REQ合并为一个,然后仅当两个REQ数据都可用时才能解决

const promises = [];
promises.push(this.menuService.getParentMenu());
promises.push(this.menuService.getParentMenu());
Promise.all(promises).then(responselist=>{
//call any function of your choice, responselist will be an array of two results 
// of your services
})
//if you are using angular then you can do something like this
import {Observable} from 'rxjs/Rx';
const reqs: Observable<any>[] = [];
reqs.push(this.menuService.getParentMenu());
reqs.push(this.menuService.getParentMenu());
Observable.forkJoin(reqs).subscribe(responseList => {
this.parentMenu = responseList[0];
this.childMenu = responseList[1];
//Or you loop through responselist
responseList.map((res,index)){}
});

AT82 3 年前

shareReplay 可以很好地避免再次触发http请求(假设它们是http请求…)

menus$ = forkJoin([this.LoadParentMenu(), this.LoadChildMenu()]).pipe(shareReplay(1))

[loadParentMenuResultHere, loadChildMenuResultHere]

现在你可以订阅了 menus$ async 管道,因为它为您退订以及,所以我建议您,如果可能的话。

如果您甚至希望在默认情况下执行第三个功能,那么您也可以在那里链接该功能,并且您已经根据您的需求构建了一个结构化的数组,因此如下所示:

menus$ = forkJoin([this.LoadParentMenu(), this.LoadChildMenu()]).pipe(
  map( /** do your magic here and return the data structure you want! **/ )
  shareReplay(1)
);