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

Question

我正在使用 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
}

但我的要求是从两个服务中获取数据，将它们绑定到一个全局数组变量，最后在另一种方法（实际上是第三种方法）中使用它们。我尝试按如下方式在控制台中执行 returns undefined:

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);

有什么合适或简单的方法可以做到以上几点吗？

Answer 1

在我看来，这将是可观察对象的完美用途，而且如果这不会更改数据，shareReplay 可能会很好地避免再次触发 http 请求（假设它们是 http 请求。 ..)

服务：

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

forkJoin 并行运行这些请求，returns 一个包含 2 项数据的数组，就像在伪中一样：

[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)
);

Answer 2

它 returns 未定义，因为 typescript 逐行执行，console.log 在从服务器获取数据之前被调用。您可以将这两个请求合并为一个，然后只有在两个请求数据都可用时才会解析

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)){}
});

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

Assign Data From One Function To Another

typescript

angular

angular8