PrimeNg: Comment créer une nouvelle instance des éléments dans une boîte de dialogue lorsque la boîte de dialogue est affichée

Question

J'utilise la boîte de dialogue primeNg dans une application Angular2, comme ceci:

<p-dialog 
    header="Dialog" 
    [(visible)]="display" 
    [modal]=true 
    [closable]=true 
    [resizable]=false 
    [width]=500 
    > 
     <input type="text"/> 
    </p-dialog> 

Supposons maintenant que je fais ce qui suit :

• Lancer la boîte de dialogue
• type Led Zeppelin dans la boîte de dialogue
• Fermez la boîte de dialogue
• R eouvrez la boîte de dialogue

L'entrée est maintenant remplie avec Led Zeppelin. Je comprends que la même instance de l'entrée est utilisée, mais ce n'est pas le comportement que je veux. Je voudrais que la boîte de dialogue utilise une nouvelle entrée chaque fois qu'elle est lancée. Quel est le bon moyen de le faire? Une façon d'aborder cela pourrait être d'utiliser le onBeforeShow pour réinitialiser l'entrée.

Answer 1

Il n'est pas nécessaire de le fixer à un crochet de cycle de vie spécifique. Je suppose que vous utilisez un bouton pour afficher la boîte de dialogue, à ce bouton, vous pouvez joindre une méthode ou une phrase javascript comme ceci:

<button pButton type="button" (click)="newName='';displayDialog();"></button> 

et votre entrée ressemble à:

<input id="myId" type="text" pInputText [(ngModel)]="newName"/> 

Où newName='' est une variable de type string que vous nettoyez avant d'afficher la boîte de dialogue et pInputText est une directive primeng: link

Peu importe si vous n'utilisez pas un bouton pour déclencher le dialogue, je pense que vous avez eu l'idée.