Angular4 PrimeNG dialog as component Angular4 PrimeNG dialog as component angular angular

Angular4 PrimeNG dialog as component


I made it on my own. As i said an EventEmitter is needed here.

list-component.html:

<button class="btn btn-default openBtn" type="button"     pButton label="Open" [disabled]="jobClosed" (click)="showDialog()"></button><app-details [display]="display" (displayChange)="onDialogClose($event)"></app-details>

list-component.ts:

display: boolean = false;showDialog() {    this.display = true;}onDialogClose(event) {   this.display = event;}

dialog-component.html:

<p-dialog [(visible)]="display" modal="modal" [responsive]="true">   <p>Runs!</p></p-dialog>

dialog-component.ts:

  @Input() display: boolean;  @Output() displayChange = new EventEmitter();  onClose(){    this.displayChange.emit(false);  }  // Work against memory leak if component is destroyed  ngOnDestroy() {    this.displayChange.unsubscribe();  }