Question

我正在尝试在我的angular / typescript项目中实现缓存，以防止重复进行http.get（）调用以将userId转换为用户全名。

dataService返回一个对象列表，例如，对象看起来像这样{location: 'abc', food: 'abc', userId: 'idA'}，为了显示，我想将每个对象变换成这样：{location: 'abc', food: 'abc', userId: 'idA', fullName: 'John Doe'}

   getEvents(param1){
    const cache = new Map<string, string>();
    this.dataService.getEvents(param1).subscribe(
        async res => { 
            this.eventsData = [];
            for(let item of res.items){
                const key: string = item.userId;
                if(cache.get(key)){
                    item.fullName = cache.get(key);
                }
                else{
                    await this.nameService.getFullName(key).subscribe(
                        res=> {
                            cache.set(key, res);
                            item.fullName = res;
                        }
                    )
                }
                this.eventsData.push(item);
            }
        }
    );       
}

我放置Async,await的原因是因为我希望依次处理每个item，如果第二行数据具有相同的userId，它将在Map中进行查找，而不是进行调用nameService。而且我有先验知识，例如在100行数据中，只有很少的用户。

对于大小为3的列表具有完全相同的userId，我上面的代码仍然以某种方式对NameService进行了3次调用。

我尝试将以for()到push(item)开头的代码块带到另一个函数，并在该函数的前面等待，这并没有减少对nameService（依次拨打http get）。我的代码有什么问题？如果有更好的方法来缓存http get调用，请告诉我。

我在here:https://stackoverflow.com/questions/49797910/angular-5-caching-http-service-api-calls中尝试了shareReplay答案，但似乎也没有减少呼叫次数。也许我没有得到答案的意思。谢谢。

打字稿异步http获取for循环内的调用

0 个答案: