For循环未在订阅事件中执行答案

【问题标题】：For loop not executing in subscribe eventFor循环未在订阅事件中执行
【发布时间】：2019-12-26 05:05:19
【问题描述】：

我有一个聊天设计，其中左侧有一个人员列表，点击任何人时，我会在右侧打开他的聊天历史记录。所以我需要使用 RXJS 订阅调用将用户详细信息从一个组件发送到另一个组件。现在数据传输成功，但问题是，在通过subscribe 调用正确组件接收用户详细信息后，我正在调用一个 API 让用户访问聊天历史记录并希望在该组件中显示聊天，因此，我需要在 API 的成功响应中添加 for 循环，但 for 循环未执行。下面是我的右侧组件代码。

` ngOnInit() {

    this.userProfileId = this.utilService.getCurrentLoginUserProfileId();
    if (this.userProfileId) {

      this.friendId = this.userDetail.userProfileId;
       // get users data
      this.utilService.onChangeUserDetailData.subscribe(data => {
      console.log('data', data);
      if (data) {
        this.userDetail = data;
        this.friendId = this.userDetail.userProfileId;
        this.sendUserOnlineSocket(data);


        // get chat history api
        this.getUsersChatData(data);
        }
    });

    }

// get users chat data
  getUsersChatData(user: any) {
    let postObj;
    if (user.chatRoomId) {
      postObj = {
        from_user: this.userProfileId,
        to_user: user.chatRoomId
      };
    } else if (user.userProfileId) {
      postObj = {
        from_user: this.userProfileId,
        to_user: user.userProfileId
      };
    }

    this.chatPageService.getChatData(postObj).then((res: any) => {
      console.log(' chat data res', res);
      if (res['status'] === 200) {
        if (res['data']['length'] > 0) {
          for (let i = 0; i < res.data.length; i++) {
            console.log('message response', res[i]);
            if (res[i]['user_profile_id'] === this.userProfileId && res[i]['to_user_id'] === this.friendId) {
              this.messageData.push({ side: 'right side', data: res[i] });
            } else {
              this.messageData.push({ side: 'left side', data: res[i] });
            }
          }
          console.log('message data', this.messageData);
        }
        console.log('message data', this.messageData);
      }
      console.log('message data', this.messageData);
    }).catch(err => {
          if (err.hasOwnProperty('error')) {
            this.utilService.errorHandler(err.error);
          } else {
            this.utilService.showError(
              'Error',
              this.utilService.commonErrorMsg
            );
          }
    });
  }

`

我成功地获得了“聊天数据资源”控制台，但在for 循环中我得到了未定义的“消息响应”，并且下面的控制台没有被执行。请向我建议一个解决方案或任何其他选项来执行此操作。

【问题讨论】：

您是否检查过 chrome 开发工具中的网络选项卡以查看该 http 请求返回的错误状态代码。它可能不是 200 响应。请在您的问题中也显示 getChatData 方法。
@LloydNicholson 我获得了成功 res 。我也得到了这个控制台 console.log('chat data res', res);但之后下面的forloop就不起作用了
@Annonymous 你做错了。 console.log('消息响应', res.data[i]);请检查您有控制台的行。您需要在该位置检索的数据对象不是 res 对象。没有 res[i] 因为这个你在结果中没有定义。

标签： angular typescript

【解决方案1】：

根据您的代码，您犯了一个错误。

你需要检查res.data[i]而不是res[i]

for (let i = 0; i < res.data.length; i++) {
        console.log('message response', res.data[i]);             
 }

检查上面您将获得您的数据，在此更改之后，将res[i]['user_profile_id'] 替换为res.data[i]['user_profile_id']。在需要时对您的代码进行此更改

【讨论】：

@Annonymous 提示：而不是访问res['data']['length'] 和res.data 两次我会使用let data = res.data; 然后data.length 并使用数据变量抛出整个执行!