在管道中使用扩展替换值
Using expand in pipe replaces values
我目前有一项服务,我可以借助展开来获取一些模板以在视图中显示它们。我的想法是继续获取直到我拥有所有东西。
但是,当我通过管道扩展时,它会替换值而不是添加它们,我该如何解决这个问题?
示例:
templates$: Observable<Template[]>;
let count = 0;
this.templates$ = this.templateService.getTemplates(0, 5).pipe(
expand(result => {
count += result.length;
if (result.length === 5) {
return this.templateService.getTemplates(count, 5);
} else {
return empty();
}
})
);
expand
不会替换值,它会在您每次收到五个一组的模板时发出。在您看来,如果您使用 template$ | async
,您只会看到最后的结果。
要收集所有模板,您可以使用 scan
运算符。
templates$: Observable<Template[]>;
let count = 0;
this.templates$ = this.templateService.getTemplates(0, 5).pipe(
expand(result => {
count += result.length;
if (result.length === 5) {
return this.templateService.getTemplates(count, 5);
} else {
return empty();
}
}),
scan((acc, curr) => acc.concat(curr))
);
如果您不想显示中间结果,您也可以以相同的方式使用 reduce
运算符。
我目前有一项服务,我可以借助展开来获取一些模板以在视图中显示它们。我的想法是继续获取直到我拥有所有东西。
但是,当我通过管道扩展时,它会替换值而不是添加它们,我该如何解决这个问题?
示例:
templates$: Observable<Template[]>;
let count = 0;
this.templates$ = this.templateService.getTemplates(0, 5).pipe(
expand(result => {
count += result.length;
if (result.length === 5) {
return this.templateService.getTemplates(count, 5);
} else {
return empty();
}
})
);
expand
不会替换值,它会在您每次收到五个一组的模板时发出。在您看来,如果您使用 template$ | async
,您只会看到最后的结果。
要收集所有模板,您可以使用 scan
运算符。
templates$: Observable<Template[]>;
let count = 0;
this.templates$ = this.templateService.getTemplates(0, 5).pipe(
expand(result => {
count += result.length;
if (result.length === 5) {
return this.templateService.getTemplates(count, 5);
} else {
return empty();
}
}),
scan((acc, curr) => acc.concat(curr))
);
如果您不想显示中间结果,您也可以以相同的方式使用 reduce
运算符。