循环进入 Object 以过滤它有时有效，有时无效 Angular 11答案

【问题标题】：Looping into Object to filter it comes out that sometimes works and sometimes not Angular 11循环进入 Object 以过滤它有时有效，有时无效 Angular 11
【发布时间】：2021-03-22 07:36:32
【问题描述】：

我正在我的代码中开发一个朋友逻辑。例如，两个用户可以彼此成为朋友。第 1 个用户向 2 个用户发送请求，第 2 个用户收到通知有人将您添加为朋友。然后 2 用户接受它。但是，如果我从 1 个用户迭代到 2 个用户，我会检查他们是否是朋友有时可以工作，有时不能。问题是，即使我是朋友，它也会再次对我说Add as friend，这不是我想要的。但有时如果我重新加载页面，它就会起作用。注意this.data.user是friend的ID

在我正在处理的请求中，让我所有的朋友都可能会出现问题。

这是我用于检查他们是否是朋友的代码，在ngOnInit 调用。

 checkFriend: User[] = [];

  if(success[1]) {
          this.data = success[0];
          this.checkFriends(this.data.user);
} else {

      this.modelDataService.getUserModel(this.outsideUserId).subscribe((t: Model) => {
        this.data = t;
        this.loadActiveUserConnections(this.data.user);
        this.checkFriends(this.data.user);
}
this.modelDataService.getOutsideModel(this.outsideUserId).subscribe((t: Model) => {
            this.data = t;
            this.loadActiveUserConnections(this.data.user);
            this.checkFriends(this.data.user);
    }  //The problem occurs here because here both are called from otuside


 checkFriends(id) {
    this.friendService.getAllFriendRequests().subscribe((finalRequesters) => {
      this.checkFriend = finalRequesters;
      this.checkFriend.forEach((oneRequest: any) => {
        console.log(oneRequest);
        if ((oneRequest.friendId === id || oneRequest.friendId === id) && oneRequest.status === "You are friend") {
          oneRequest.isFriend = true;
          this.isFriend = true;
        } else if (oneRequest.friendId === id && oneRequest.status === "Request Pending") {
          oneRequest.uniqueId = oneRequest.userId;
          oneRequest.isRequest = true;
          this.isRequest = true;
        } else {
         this.isFriend = false;
         this.isRequest = false;
        }
      });
    });

  }

这是 HTML 代码。

   <a class="px-1" *ngIf="!checkUser">
      <button class="px-3 font-weight-600 btn btn-light" (click)="addFriend()" *ngIf="!isFriend && !isRequest">
        <span class="bi bi-person-plus-fill d-flex align-items-center">
          <span class="pl-2">Add Contact</span>
        </span>
      </button>
      <button class="px-3 font-weight-600 btn btn-light" *ngIf="isRequest">
        <span class="bi bi-person-plus-fill d-flex align-items-center">
          <span class="pl-2">Cancel Contact Request</span>
        </span>
      </button>
    </a>

这就是请求。

getAllFriendRequests() {
  return this.http.get<any[]>(this.apiBaseURL + "/friends");
}

这就是oneRequest 的样子。

  { createdDate: "2021-03-20T22:24:54.512Z"
    friendId: "602e4c30e3346466703376ab"
    id: "605676360fb6b109209674be"
    status: "You are friend"
    userId: "5fbc1bc72ffec245c4bd7725"
    __v: 0
    _id: "605676360fb6b109209674be"
    __proto__: Object}

friendId 是朋友 ID，userId 是经过身份验证的用户。但是，如果我尝试控制台记录oneRequest，它会返回整个对象数组，而不仅仅是对象。

这就是后端的样子。

  async showUserCV(req, res) {
        ModelData.aggregate()
        let modelData = await ModelData.findOne({userUrl: req.params.id }).populate("user").exec();
        if (!modelData) {
            res.status(204).json({error: "No Data"});
            return;
        }
        return res.status(200).send(modelData);
    },

const ModelData = require("../models/data");

【问题讨论】：

是否可以提供带有模拟数据的堆栈闪电战？
@AakashGarg 我会试试的。
@AakashGarg 但这会很难-_-，因为它的代码太大了。但我会尽力而为。
尝试以最小的可能性重现模拟场景。
这只是一个想法，但尝试在订阅函数中调用this.checkFriend = finalRequesters.body，因为你得到了一个HttpResponse。 (angular.io/api/common/http/HttpResponse)

标签： javascript angular typescript rxjs

【解决方案1】：

如果你想循环覆盖数据，你可以使用 map() 代替 forEach()。试试这个：

this.checkFriend.map((oneRequest: any) => {
  // Put what u want to do in loop here
}

【讨论】：

@Svanthna map 不行，我试过了。当我从新标签或重新加载页面进入页面时会出现问题。