Question

我的Angular应用程序中有一个注释列表，注释列表具有UserId参数。

使用此UserId，我调用User服务以获取userName并将其映射回Notes列表。

由于Notes列表的大小可能很大，因此我想减少发送到服务器以重复获取用户名的呼叫数量，因为Note可以是同一用户。所以我写了下面的代码

Notes.component

 this.items.forEach(element => {
      console.log("Note UserId ", element.UserId);
    this.userService.loadByUserId(element.UserId).subscribe(res => element.Name = res.Name);
    });

UserService

loadByUserId(userId: string): Observable<any> {
    //TODO: Figure better way to check for cached users with multiple async calls at once
    if (userId) {
      if (this.pendingUsers.filter(f => f == userId).length == 0) {
        this.pendingUsers.push(userId);
        if (this.users.find(x => x.UserId === userId)) {
          const source = Observable.from(this.users);
          return source.find(f => f.UserId === userId);
        } else {
          return this._api.get('User/' + userId).map(res => {
            if (this.users.filter(f => f.UserId == res.UserId).length == 0) {
              console.log("added user ", res.Name);
              this.users.push(res);
            }
            return res;
          });
        }
      }
      else {
        return Observable.empty();
      }
    } else {
      return Observable.empty();
    }
  }

我的问题是，由于注释列表上的foreach运行异步并且未在loadByUserId（）中订阅Observable，因此未填充pendingUsers和Display users数组

有关如何解决此代码或任何其他替代方法的任何投入。我尝试实现管道，但是遇到了同样的问题。请不要建议将用户名字段移到响应/注释列表内，因为目前尚不可行。

Angular如何在没有Redux的情况下实现对象缓存

0 个答案: