Question

我有一个带有两个简单数字的对象，然后是一个对象列表：

export class Lineup {
  players: Player[];
  fantasypoints: number;
  salary: number;

  constructor(values: Object = {}) {
    Object.assign(this, values);
  }
}

我点击了一项服务，并在其中填充了一个帖子（我加入了一些玩家，并从中获得了阵容：

public postLineup(players): Observable < Lineup > {
  return this.http.post <Lineup>(`${API_URL}/optimize`, JSON.stringify(players));
}

此POST返回的数据很好，据我所知它将正确将JSON填充到Lineup对象中。

但是，当我尝试将这些值分配给组件变量时，在我的app.component中，以便我可以实际使用数据。我似乎无法完成任务。

onClickOptimize() {
  this.apiService.postLineup(this.playerSource.data)
    .subscribe(lineupreturned => {
      this.lineupSource = new MatTableDataSource(lineupreturned.players);
      this.salary = lineupreturned.salary;
      this.fantasypoints = lineupreturned.fantasypoints;
      this.displaylineup = true;
      console.log("component output:"), console.log(lineupreturned);
    });
}

console.log的{{1}}实际上显示了一个对象，并且已填充该对象。但是，如果要登录lineupreturned或任何其他变量，它将以this.salary的形式返回。我一生都无法理解为什么这些变量都没有被填充。

编辑：带有从console.log返回的变量结果的阵容：

undefined

Answer 1

我注意到的一些问题：

这是您真正不需要的JSON.stringify(players)。

public postLineup(players): Observable < Lineup > {
  return this.http.post <Lineup>(`${API_URL}/optimize`, JSON.stringify(players));
}

这应该是：

public postLineup(players): Observable < Lineup > {
  return this.http.post <Lineup>(`${API_URL}/optimize`, players);
}

另一件事是

onClickOptimize() {
  this.apiService.postLineup(this.playerSource.data)
    .subscribe(lineupreturned => {
      const actualResponse = lineupreturned[0];
      this.lineupSource = new MatTableDataSource(actualResponse.players);
      this.salary = actualResponse.salary;
      this.fantasypoints = actualResponse.fantasypoints;
      this.displaylineup = true;
      console.log("component output:"), console.log(lineupreturned);
    });
}

在这里，您使用的是new MatTableDataSource(lineupreturned.players)，它可能引发了错误。

因此，您可能希望在此处放置一个断点以查看lineupreturned的实际值，并在控制台上检查是否有任何错误。

更新

从您的console.log输出中，看起来实际的响应是一个数组，其中只有一个对象。该对象将包含fantasypoints，players和salary之类的东西。

因此，请在我更新时更改您的订阅代码。

从订阅对象分配多个值

1 个答案:

更新