使用 Observables 合并子数组
Merge subarrays using Observables
我有这个数据结构:
[{
id : 1,
name : "Item 1",
subItems : [{
id : 1,
name : "SubItem 1"
},{
id : 2,
name : "SubItem 2"
}
]
}, {
id : 2,
name : "Item 2",
subItems : [{
id : 3,
name : "SubItem 3"
}, {
id : 4,
name : "SubItem 4"
}
]
}]
我对 Web 服务进行了以下调用以获取项目:
this.dataService.get("items")
返回的是 Observable<Item[]>
。我可以使用哪些 Observable 运算符来仅获取子项的串联列表?我想以这样的方式结束:
[{
id : 1,
name : "SubItem 1"
}, {
id : 2,
name : "SubItem 2"
},
{
id : 3,
name : "SubItem 3"
}, {
id : 4,
name : "SubItem 4"
}]
我应该使用 flatMap
还是 concat
?
假设它是一个拼写错误并且第二个元素也有 subItems
(而不是 searchProfiles
),你不需要 flatMap 或任何类似的东西,你可以在使用 js 数组运算符的普通地图:
var transformed = [].concat(...result.map(item => item.subItems));
或者你的情况
httpResult$.map(result => [].concat(...result.map(item => item.subItems))
如果有意使用不同的键,您的内部映射将需要更多逻辑,但映射将完全相同
你想要第一个 map()
运算符只提取你需要的字段,然后它们用 concatAll()
展平对象数组(这是高阶 Observables 的一个小技巧,参见 了解更多信息):
var data = [{
id : 1,
name : "Item 1",
subItems : [
{ id : 1, name : "SubItem 1" },
{ id : 2, name : "SubItem 2" }
]
}, {
id : 2,
name : "Item 2",
searchProfiles : [
{ id : 3, name : "SubItem 3" },
{ id : 4, name : "SubItem 4" }
]
}];
Observable.from(data)
.map(item => {
if (item.searchProfiles) {
return item.searchProfiles;
} else if (item.subItems) {
return item.subItems
}
})
.concatAll()
.subscribe(val => console.log(val));
这将打印到控制台:
{ id: 1, name: 'SubItem 1' }
{ id: 2, name: 'SubItem 2' }
{ id: 3, name: 'SubItem 3' }
{ id: 4, name: 'SubItem 4' }
或者,如果您确实希望输出为单个数组,则可以在 .concatAll()
和 .subscribe(...)
之间添加 toArray()
运算符,您将收到:
[ { id: 1, name: 'SubItem 1' },
{ id: 2, name: 'SubItem 2' },
{ id: 3, name: 'SubItem 3' },
{ id: 4, name: 'SubItem 4' } ]
我有这个数据结构:
[{
id : 1,
name : "Item 1",
subItems : [{
id : 1,
name : "SubItem 1"
},{
id : 2,
name : "SubItem 2"
}
]
}, {
id : 2,
name : "Item 2",
subItems : [{
id : 3,
name : "SubItem 3"
}, {
id : 4,
name : "SubItem 4"
}
]
}]
我对 Web 服务进行了以下调用以获取项目:
this.dataService.get("items")
返回的是 Observable<Item[]>
。我可以使用哪些 Observable 运算符来仅获取子项的串联列表?我想以这样的方式结束:
[{
id : 1,
name : "SubItem 1"
}, {
id : 2,
name : "SubItem 2"
},
{
id : 3,
name : "SubItem 3"
}, {
id : 4,
name : "SubItem 4"
}]
我应该使用 flatMap
还是 concat
?
假设它是一个拼写错误并且第二个元素也有 subItems
(而不是 searchProfiles
),你不需要 flatMap 或任何类似的东西,你可以在使用 js 数组运算符的普通地图:
var transformed = [].concat(...result.map(item => item.subItems));
或者你的情况
httpResult$.map(result => [].concat(...result.map(item => item.subItems))
如果有意使用不同的键,您的内部映射将需要更多逻辑,但映射将完全相同
你想要第一个 map()
运算符只提取你需要的字段,然后它们用 concatAll()
展平对象数组(这是高阶 Observables 的一个小技巧,参见
var data = [{
id : 1,
name : "Item 1",
subItems : [
{ id : 1, name : "SubItem 1" },
{ id : 2, name : "SubItem 2" }
]
}, {
id : 2,
name : "Item 2",
searchProfiles : [
{ id : 3, name : "SubItem 3" },
{ id : 4, name : "SubItem 4" }
]
}];
Observable.from(data)
.map(item => {
if (item.searchProfiles) {
return item.searchProfiles;
} else if (item.subItems) {
return item.subItems
}
})
.concatAll()
.subscribe(val => console.log(val));
这将打印到控制台:
{ id: 1, name: 'SubItem 1' }
{ id: 2, name: 'SubItem 2' }
{ id: 3, name: 'SubItem 3' }
{ id: 4, name: 'SubItem 4' }
或者,如果您确实希望输出为单个数组,则可以在 .concatAll()
和 .subscribe(...)
之间添加 toArray()
运算符,您将收到:
[ { id: 1, name: 'SubItem 1' },
{ id: 2, name: 'SubItem 2' },
{ id: 3, name: 'SubItem 3' },
{ id: 4, name: 'SubItem 4' } ]