时间戳

首页 > 解决方案 > 循环中的 PrimeNg V6 确认服务

angular - 循环中的 PrimeNg V6 确认服务

问题描述

我试图在循环中调用确认服务，但只执行最后一次调用。有什么我需要改变的吗？

for (let x of y) {
    if (conditionIsMet) {
        this.confirmationService.confirm({
            message: 'Question Text',
            header: 'Confirmation',
            icon: 'fa fa-refresh',
            accept: () => {
                //DO Accept Work
            },
            reject: () => {
                //Do Rejection Work
            }
        });
    } else {
        //Do something else
    }
}

标签： angulartypescriptangular6primeng

解决方案

该组件是单个实例，因此每次将新实例推送到 ConfirmationService 时，都会覆盖前一个实例。要一个接一个地打电话，您需要以某种方式添加等待一个确认结束，然后再拨打下一个电话。

我对此进行了快速测试，并通过创建一个“confirmationQueue”数组然后像这样递归调用服务来让它工作：

this.confirmQueue = [];
for (let x of y) {
    if (conditionIsMet) {
        this.confirmQueue.push(x);
    } else {
        //Do something else
    }
    this.displayNextConfirm();
}

<snip>

private displayNextConfirm(): void {
    if (this.confirmQueue && this.confirmQueue.length > 0) {
        setTimeout(() => {
            let x = this.confirmQueue[0];
            this.confirmQueue = this.confirmQueue.slice(1);
            this.confirmationService.confirm({
                message: 'Question Text',
                header: 'Confirmation',
                icon: 'fa fa-refresh',
                accept: () => {
                    //DO Accept Work
                    this.displayNextConfirm();
                },
                reject: () => {
                    //Do Rejection Work
                    this.displayNextConfirm();
                }
            });
        }, 1);
    }
}

（请注意，setTimeout(() => {...}, 1)允许在服务尝试打开下一个确认对话框之前清除当前确认对话框。）

显然还有其他方法可以实现这一点，但关键是一次只向 ConfirmationService 提交一个调用，并等待该调用完成后再提交下一个调用。

推荐阅读