时间戳

首页 > 解决方案 > 动态创建的对象在尝试访问其键值时返回未定义

javascript - 动态创建的对象在尝试访问其键值时返回未定义

问题描述

我有一个看起来像这样的学生对象......

{
  Freshmen: [{id: 3}, {id: 5}],
  Sophomores: [{id: 2}, {id: 6}],
  Juniors: [{id: 1}, {id: 8}],
  Seniors: [{id: 9}, {id: 4}, {id: 7}]
}

我需要根据数组中的 id 查找学生。我需要返回的是一个看起来完全一样的对象，但是我现在从数据库中检索到了完整的对象，而不是只包含 id 的对象。

在我的 angular component.ts 文件中，我试图通过以下方式这样做......

  private getStudents(obj) {
    const result = {};
    for (const key of Object.keys(obj)) {
      obj[key].map(item => {
        this.studentsService.geStudentById(item.id).subscribe(res => {
          result[key] = [];
          result[key].push(res);
        });
      });
    }
    return result;
  }

我有一个服务注入到组件中。该服务有一个通过 id 获取学生的方法，我在里面调用服务方法getStudents()。该服务返回相应的学生对象，然后我将其推送到数组中。

后来我调用该函数并将结果分配给一个studentDetails像这样的变量......

this.studentDetails = this.getStudents(studentObj);

一切似乎都工作正常，除了当我尝试做......console.log(this.StudentDetails.Freshmen);例如，我得到undefined.

我是以正确的方式解决这个问题还是有更好的方法可以处理它，比如使用arr.reduce()而不是arr.map()？尽管我尝试过 reduce 并且由于某种原因它只返回一项。您的帮助将不胜感激。

标签： javascriptangulartypescript

解决方案

您在 return 之前异步调用 a result。发生的事情是您的函数{}在所有请求完成之前返回一个空对象。

你需要这样的东西（需要一些重构）：

function getStudents(obj) {
const result = {};
const requests=  [];
for (const key of Object.keys(obj)) {
   obj[key].forEach(item => {
    let currentRequest = this.studentsService.geStudentById(item.id)
    .subscribe(res => {
      result[key] = [];
      result[key].push(res);
    });
    requests.push(currentRequest)
  });
}
return Observable.forkJoin(...requests).subscribe(() => {
    return result;
})

}

然后studentDetails像这样设置道具：

this.getStudents(studentObj).subscribe(result => this.studentDetails = result)

推荐阅读