Angular Refresh Page Without Reloading Code Example

Example 1: how to refresh page angular

refresh(): void {     window.location.reload(); }

Example 2: angular refresh page without reloading

this.router.navigate(['path/to'])   .then(() => {     window.location.reload();   });

Example 3: angular reload component

reloadCurrentRoute() {     let currentUrl = this.router.url;     this.router.navigateByUrl('/', {skipLocationChange: true}).then(() => {         this.router.navigate([currentUrl]);     }); }

Example 4: angular 6 reload current page

import { DOCUMENT } from '@angular/common'; import { Component, Inject } from '@angular/core';  @Component({   selector: 'app-refresh-banner-notification',   templateUrl: './refresh-banner-notification.component.html',   styleUrls: ['./refresh-banner-notification.component.scss'] })  export class RefreshBannerNotificationComponent {    constructor(     @Inject(DOCUMENT) private _document: Document   ) {}    refreshPage() {     this._document.defaultView.location.reload();   } }

Example 5: how to make a component reload in angular

DeleteEmployee(id:number)   {     this.employeeService.deleteEmployee(id)     .subscribe(        (data) =>{         console.log(data);         this.ngOnInit();       }),       err => {         console.log("Error");       }      }

Example 6: angular refresh component without reloading page

/*You can use a BehaviorSubject for communicating between different  components throughout the app.  You can define a data sharing service containing the BehaviorSubject to  which you can subscribe and emit changes.  Define a data sharing service */  import { Injectable } from '@angular/core'; import { BehaviorSubject } from 'rxjs';  @Injectable() export class DataSharingService {     public isUserLoggedIn: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false); }  /*Add the DataSharingService in your AppModule providers entry.  Next, import the DataSharingService in your <app-header> and in the  component where you perform the sign-in operation. In <app-header>  subscribe to the changes to isUserLoggedIn subject: */  import { DataSharingService } from './data-sharing.service';  export class AppHeaderComponent {      // Define a variable to use for showing/hiding the Login button     isUserLoggedIn: boolean;      constructor(private dataSharingService: DataSharingService) {          // Subscribe here, this will automatically update          // "isUserLoggedIn" whenever a change to the subject is made.         this.dataSharingService.isUserLoggedIn.subscribe( value => {             this.isUserLoggedIn = value;         });     } }  /*In your <app-header> html template, you need to add the *ngIf  condition e.g.: */  <button *ngIf="!isUserLoggedIn">Login</button>  <button *ngIf="isUserLoggedIn">Sign Out</button>  // Finally, you just need to emit the event once the user has logged in e.g:  someMethodThatPerformsUserLogin() {     // Some code      // .....     // After the user has logged in, emit the behavior subject changes.     this.dataSharingService.isUserLoggedIn.next(true); }