angular - 按对象属性过滤可观察数组

Question

我目前有一个可观察对象数组，我正在使用带有异步管道的 *ngFor 循环对其进行迭代。我想通过对象的属性值过滤可观察对象，例如

原始数组:

[{ name: test1,
   type: type1},
 { name: test2,
   type: type2}
 { name: test3,
   type: type1}
 { name: test4,
   type: type2}]

我想对此进行过滤并制作两个新的可观察对象(数组)，一个用于 type1，一个用于 type2

我尝试了 obs.filter(x => x.type == "type1) 但它什么也没返回

然后我尝试了 obs.mergeAll().filter(x => x.type == "type1") 我可以订阅它并正确地将它记录到控制台，但现在它没有无法使用我的 *ngFor(异步管道)。我猜这是因为 mergeAll 意味着它不再是一个可观察的数组？那么我需要将其转换回来吗？

Answer 1

您可能缺少 RXJS6 中的管道运算符。

import { of, from } from "rxjs";

import { filter, map } from "rxjs/operators";

const obs = from([{
    name: 'test1',
    type: 'type1'
},
{
    name: 'test2',
    type: 'type2'
},
{
    name: 'test3',
    type: 'type1'
},
{
    name: 'test4',
    type: 'type2'
}]);

const source = obs.pipe(
    filter(data => data.type === 'type2')
)


console.log(source.subscribe(item => console.log(item)));
// prints {name: "test2", type: "type2"}
{name: "test4", type: "type2"}

如果你想得到一个数组:

const items = [];
console.log(source.subscribe(item => items.push(item)));
console.log(items);