events - 装箱确认服务

我有一个使用确认服务的组件，如下所示

@Component({
    moduleId: module.id,
    templateUrl: 'account-list.component.html',
    providers: [AccountService],
    selector: 'account-list'
}).....

deleteAccount(Account: Account) {
    this.confirmationService.confirm({
        header: 'Delete Confirmation', message: 'Are you sure that you want to delete this account?',
        icon: 'fa fa-trash',
        accept: () => {
            this.AccountService.deleteAccount(Account.account_id).subscribe(
                res => {
                    let index: number = this.Accounts.findIndex(n => n.account_id === Account.mc_account_id);
                    if (~index) {
                        this.Accounts.splice(index, 1);
                    }
                    this.msgs.push({ severity: 'Info', summary: 'The account is deleted' });
                },
                err => {
                    this.msgs.push({ severity: 'Error', summary: err.message });
                }
            );

        }
    });
}

此组件可以单独使用，也可以正常工作。当将此组件用作子组件时，将触发两次确认服务。 IE。当我想删除一个对象时，我需要多次单击“接受”或“拒绝”按钮。

我在数据表组件的rowexpantion中使用此组件，如下所示:

<template let-parent pTemplate="rowexpansion">
        <div class="outer" *ngIf="parent">
            <div class="inner">
                <account-list [parentId]="parent.parent_id"> </account-list>

            </div>
        </div>
    </template>

在此示例中，我的组件用于显示父组件的数据表的帐户详细信息，每次我扩展父表的一行时，我都需要再单击一次接受或拒绝按钮。
问候

最佳答案

基于priming Docs



由于我使用的是嵌套组件树，因此需要在html模板中为每个确认服务添加一个键，如下所示

<p-confirmDialog key="account"></p-confirmDialog>

在ts代码中，我还需要指定 key ，如下所示:

 this.confirmationService.confirm({
                header: 'Delete Confirmation',
                key:'account';