2017-08-17 2 views
0

Ich habe eine Komponente, die Bestätigung Dienst verwendet, wieprimeng Bestätigung Service

@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 }); 
       } 
      ); 

     } 
    }); 
} 

fein Diese Komponente arbeitet folgt als allein. Wenn diese Komponente als untergeordnete Komponente verwendet wird, wird der Bestätigungsservice zweimal ausgelöst. I.e. Wenn ich ein Objekt löschen möchte, muss ich mehr als einmal auf die Schaltfläche "Akzeptieren" oder "Ablehnen" klicken.

Ich benutze diese Komponente in rowexpantion in Komponentendatentabelle wie folgt:

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

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

In diesem Beispiel meiner Komponente verwendet wird, um die Konten Details für eine Datentabelle für die übergeordnete Komponente zu zeigen, jedes Mal, wenn ich eine Zeile erweitern der Elterntabelle, dann muss ich noch einmal auf die Schaltflächen "Akzeptieren" oder "Ablehnen" klicken. Grüße

Antwort

2

Basierend auf primeng Docs

Schlüssel: Optional Schlüssel den Schlüssel des Objekts bestätigen anzupassen, notwendig zu verwenden, wenn Komponentenbaum mehrere Bestätigungsdialoge hat.

Da ich einen Baum von verschachtelter Komponente verwenden, ich brauchte einen Schlüssel für jede Bestätigung Dienst hinzufügen, wie in der Vorlage html folge

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

im ts Code, den ich auch den Schlüssel angeben muß wie folgt:

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