如何在 Angular 中将行转换为列以及将列转换为行

Question

只需要您的帮助和想法，了解如何以角度将行转换为列，将列转换为行。

[ {"playerId": "1001","playerName": "Lebron James","game": "Game1","score": 35}, {"playerId": "1001","playerName": "Lebron James","game": "Game2","score": 40}, {"playerId": "1001","playerName": "Lebron James","game": "Game3","score": 38}, {"playerId": "1001","playerName": "Lebron James","game": "Game4","score": 25}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game1","score": 18}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game2","score": 12}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game3","score": 7}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game4","score": 17} ]

到

[ {"playerId": "1001","playerName": "Lebron James","Game1": 35,"Game2": 40,"Game3": 38,"Game4": 25,"total": 138}, {"playerId": "1002","playerName": "Anthony Davis","Game1": 18,"Game2": 12,"Game3": 7,"Game4": 17,"total": 54} ]

然后回到

[ {"playerId": "1001","playerName": "Lebron James","game": "Game1","score": 35}, {"playerId": "1001","playerName": "Lebron James","game": "Game2","score": 40}, {"playerId": "1001","playerName": "Lebron James","game": "Game3","score": 38}, {"playerId": "1001","playerName": "Lebron James","game": "Game4","score": 25}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game1","score": 18}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game2","score": 12}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game3","score": 7}, {"playerId": "1002","playerName": "Anthony Davis","game": "Game4","score": 17} ]

Answer 1

它不是特定于 Angular 的，而是特定于 JavaScript 的……你应该了解如何对数组进行分组

我的尝试如下代码片段，使用数组的reduce方法和对象的方法来获取值

• 创建一个具有唯一值的对象，并检查作为键的值是否存在相应的组
• 对象值将是您通常需要的结构..

const data = [{
  "playerId": "1001",
  "playerName": "Lebron James",
  "game": "Game1",
  "score": 35
}, {
  "playerId": "1001",
  "playerName": "Lebron James",
  "game": "Game2",
  "score": 40
}, {
  "playerId": "1001",
  "playerName": "Lebron James",
  "game": "Game3",
  "score": 38
}, {
  "playerId": "1001",
  "playerName": "Lebron James",
  "game": "Game4",
  "score": 25
}, {
  "playerId": "1002",
  "playerName": "Anthony Davis",
  "game": "Game1",
  "score": 18
}, {
  "playerId": "1002",
  "playerName": "Anthony Davis",
  "game": "Game2",
  "score": 12
}, {
  "playerId": "1002",
  "playerName": "Anthony Davis",
  "game": "Game3",
  "score": 7
}, {
  "playerId": "1002",
  "playerName": "Anthony Davis",
  "game": "Game4",
  "score": 17
}]


const grouped = data.reduce((acc, curr) => {
    if(!(curr['playerId'] in acc)){
      acc[curr['playerId']] = {'playerName': curr.playerName, total: 0, 'playerId': curr.playerId}  
    }else{
        acc[curr['playerId']][curr['game']] = curr.score;
        acc[curr['playerId']]['total'] += curr.score;
    }
    return acc
}, {})

console.log(Object.values(grouped))  // expected output