Angular中如何将对象转换为包含全部属性的数组？

看起来你是误解了数组的遍历方式～你原来的代码之所以只拿到了索引字符串形式的"id"，是因为用错了遍历方法，而且访问属性的方式也不对。

问题出在哪？ #

你的代码里：

const idItem = Object.keys(obj['items']).map(key => ({id: key, value: obj['items']['id']}));

• Object.keys(obj['items']) 作用在数组上时，返回的是数组的索引字符串（比如"0"、"1"、"2"），并不是每个item的id值；
• obj['items']['id'] 是错误的访问方式：obj['items']是数组，它没有名为id的属性，所以这里得到的是undefined，最终结果里自然看不到name和content。

正确的写法 #

因为obj.items本身就是包含所有item的数组，你只需要直接遍历这个数组，保留每个元素的所有属性即可：

方式1：直接保留所有属性（最简洁）

const idItem = obj.items.map(item => ({ ...item }));

这个写法用扩展运算符...把每个item的所有属性都复制到新对象里，最终得到的数组和原obj.items结构完全一致，每个元素都有id、name、content。

方式2：显式指定要保留的属性（更清晰）

如果你想明确列出要保留的属性，可以这样写：

const idItem = obj.items.map(item => ({
  id: item.id,
  name: item.name,
  content: item.content
}));

效果和方式1完全一样，适合需要筛选属性的场景。

示例验证 #

假设你的原始对象是：

const obj = {
  items: [
    {"id": 1, "name": "A name", "content": "A content"},
    {"id": 2, "name": "B name", "content": "B content"},
    {"id": 3, "name": "C name", "content": "C content"}
  ]
};

运行上面的代码后，idItem会是：

[
  {"id": 1, "name": "A name", "content": "A content"},
  {"id": 2, "name": "B name", "content": "B content"},
  {"id": 3, "name": "C name", "content": "C content"}
]

完全保留了所有属性～

内容的提问来源于stack exchange，提问作者Dia