我有一个包含数组的可观测对象,我在UI中使用该数组和一个异步管道来显示合同表.该表中的一列显示页面加载时"未处理"的状态值.

contracts$: Observable<ContractDto[]>

在查看init时,我从类似this.contracts$ = this.api.getContracts()的API加载合同

这很好,现在来说说我的问题:

通过单击按钮,用户可以启动运行所有合同的流程,以执行每个合同的操作.每个操作包含一个API调用,可能需要1-3秒.

现在,我想更新视图,向用户显示哪些合同已经处理,这样他就可以得到一个指示器,了解处理的进度.因此,我想在observable中覆盖合约,并在操作执行后将状态字段更新为"processed".

但是我找不到一种方法来覆盖可观察的合约并在每次迭代中更新这个.contracts$.我唯一能做的就是一个接一个地迭代和处理,但只有在处理了all个动作时才更新这个.contracts$.

我当前的代码如下所示:

// this only gets updated once all contracts have been processed
this.contracts$ = this.contracts$
            .pipe(
                // flatten array of contracts
                concatMap(contract => contract),

                // executing the process one by one; returning the updated contract
                concatMap(contract => this.deploy(contract)),

                // without toArray() i get an error on this.contracts$ assignment because 
                // ContractDto can not be assigned to ContractDto[] - which is correct.
                // and here is my missing link because I want to update this.contracts$ after EACH iteration.
                toArray(),
            )

非常感谢您的时间提前

推荐答案

如果您想要在每次迭代后更新合同$Observable,您可以使用Scan操作符和linatMap.扫描操作符允许您随时间累加值,这对于以增量方式更新合同数组非常有用.

Javascript相关问答推荐

如何提取Cypress中文本

序列查找器功能应用默认值而不是读取响应

使用useEffect,axios和useParams进行react测试

如何在JavaScript文件中使用Json文件

编剧如何获得一个div内的所有链接,然后判断每个链接是否都会得到200?

覆盖TypeScrip中的Lit-Element子类的属性类型

正则表达式,允许我匹配除已定义的子字符串之外的所有内容

如何利用CSS中的隐藏元素实现平滑扩展和防止网格行间隙

当标题被点击时,如何使内容出现在另一个div上?

是否可以将Select()和Sample()与Mongoose结合使用?

本地损坏的Java脚本

如果对象中的字段等于某个值,则从数组列表中删除对象

我怎样才能点击一个元素,并获得一个与 puppeteer 师导航页面的URL?

Chart.js Hover线条在鼠标离开时不会消失

在高位图中显示每个y轴系列的多个值

将以前缓存的 Select 器与querySelector()一起使用

在点击链接后重定向至url之前暂停

将字符串解释为数字;将其重新编码为另一个基数

需要从对象生成列表

如何从图表中映射一组图表-js使用REACT