How to refresh the current page using Angular 7? - angular7

Question

I went through many links: How to reload the current route with the angular 2 router, but I did not get working solution for me.
I have the edit screen, through Edit Screen I can add student, when I successfully added student, I should be able to see newly added Student in the same screen. Is there any way if we can do this? I am using Angular 7.
addStudents(): void {
this.student.studentId = this.studentId;
console.log(this.student);
this.studentService.saveStudent(this.student).subscribe(response => {
console.log(response);
this.memberResponse = response;
});
this.ngOnInit();
this.router.navigate(['/student-edit', this.studentList]);
}

Answer 1

If you want to use the same screen then why do you need to change the route? or reload the page?
You can do it by boolean only
Like this
Your ts file
export class myComponent {
isEditMode = true;
addStudents(): void {
this.student.studentId = this.studentId;
this.studentService.saveStudent(this.student).subscribe(response => {
this.memberResponse = response;
isEditMode = false;
});
}
}
Now in Html
<div *ngIf="isEditMode">
// HTML for edit screen
</div>
<div *ngIf="!isEditMode">
// HTML for view students screen
</div>

Answer 2

HTML
<div *ngIf="edit">
// edit student form
</div>
<div *ngIf="!edit">
// show all student table
</div>
TS File
openEditForm() { this.edit = true } // When user want to edit or add student
// Called when user clicks save on Edit Form
onSaveButtonClick() {
// Logic to save or edit student using subscription
}
1 . On successful execution of Saving or editing student call the API to GetAllStudents
On successful execution of GetAllStudents set "this.edit = false"