从`{foo：{bar: 5，can: 6}，haz：{bar: 7，can: 8}}？
从`{foo：{bar: 5，can: 6}，haz：{bar: 7，can: 8}}？
提问于 2020-06-04 02:06:31
目标：
-------------------
| | foo | haz |
-------------------
| bar | 5 | 7 |
| can | 6 | 8 |
-------------------想要…似乎是件微不足道的事情但是，乍一看，这似乎相当复杂，所有的明确要求：
<ng-container matColumnDef="score">
<th mat-header-cell *matHeaderCellDef> Score </th>
<td mat-cell *matCellDef="let user"> {{user.score}} </td>
</ng-container>我在这里遗漏了什么，是不是有一些简单的方法从输入中构造一个物质表？
回答 2
Stack Overflow用户
回答已采纳
发布于 2020-06-04 04:07:20
这可以通过下面的代码使用Object.keys()和Object.reduce()来完成。
private baseData = {
foo: {bar: 5, can: 6},
haz: {bar: 7, can: 8}
};
columnNames: string[];
data: any[];
ngOnInit() {
this.columnNames = [' '].concat(Object.keys(this.baseData));
const objects = Object.keys(this.baseData).map(key => this.baseData[key]);
this.data = Object.keys(objects[0]).reduce((acc, k) => {
const entry = { ' ' : k };
objects.forEach((o, i) => entry[this.columnNames[i + 1]] = o[k]);
acc.push(entry);
return acc;
}, []);
}请看下面的。
Stack Overflow用户
发布于 2020-06-04 04:04:33
下面是对席表的基本示例的修改堆栈闪电式：
https://stackblitz.com/edit/angular-cj5c3w
您不能为席表上的数据源使用数组，但这应该可以满足您的需要。你必须检查副作用和边缘情况。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62185710
复制相关文章
相似问题
腾讯云开发者
