Load

[vin]

Is there a way to force init on the  app-new-pod component inside a  ejs-dialog

The data is caching inside the component

tried using   ngOnChanges(changes: SimpleChanges) 

 <ejs-dialog  id='dialogSub' #ejDialog isModal='true' [visible]='visible' header='Add Pod' width='500px'>

                <app-new-pod [inpProjectId]="projectId">

                </app-new-pod>

            </ejs-dialog> 

[Revanth Krishnan]

Hi Vin, 

 

 

Greetings from Syncfusion support. 

 

 

We have validated your query “The data is caching in the component inside the Dialog. Is there a way to force `init` on the app-new-pod component”. 

 

The app-new-pod component’s data cache can be cleared by using the ‘ng-template’ to render the component inside the dialog with the ‘ngif’ condition. The condition can be set to true in the `beforeOpen` event of the dialog and set to false in the `close` event of the dialog so that the component inside dialog re-render. We have prepared a sample for your reference, 

 

Code Snippet: 

 

<ejs-dialog #Dialog (beforeOpen)="dialogBeforeOpen()" [header]='header' [showCloseIcon]='showCloseIcon' 

  (close)="dialogClose()" [content]="content"> 

  <ng-template #content> 

    <div *ngIf="isDialogRendered"> 

      <app-new-pod></app-new-pod> 

    </div> 

  </ng-template> 

</ejs-dialog> 

 

 

public isDialogRendered: boolean = false; 

 

public dialogBeforeOpen = (): void => { 

  this.isDialogRendered = true; 

}; 

public dialogClose = (): void => { 

  this.isDialogRendered = false; 

}; 

 

Sample: https://stackblitz.com/edit/angular-nvf4zk-ngqvhz?file=app.component.ts 

 

Please check the above code snippet and the sample and let us know if it satisfies your solution. 

 

Regards, 

Revanth