Is there a way to detect ERR_INTERNET_DISCONNECTED by a built in method in Angular 2+
Not sure about Angular, but the Navigator interface exposed on the global window
object has a method for determining whether or not a browser is working online.
navigator.onLine
returns a Boolean indicating whether the browser is working online. Doesn't get any simpler than that. Read the DOM docs for a more detailed description.
Example implementation:
if(navigator.onLine) { // true|false
// ...
}
In addition to checking for the property value, you can hook into offline and online events:
window.addEventListener('online', (e) => console.log(e, "you're online"));
window.addEventListener('offline', (e) => console.log(e, "you're offline"));
Then, if the user goes offline, you can freeze the UI, show relevant messages or provide an offline experience (e.g., save data to localStorage until user comes online).
I use the following method
define in your class online$: Observable<boolean>;
and inside constructor
this.online$ = Observable.merge(
Observable.of(navigator.onLine),
Observable.fromEvent(window, 'online').mapTo(true),
Observable.fromEvent(window, 'offline').mapTo(false)
)
also add the imports
import { Observable } from 'rxjs/Observable';
import 'rxjs/Rx';
Use it in template
<p *ngIf="(online$ | async) == false" >
<ngb-alert [dismissible]="false">
<strong>Warning!</strong> Better check yourself, you're not connected to internet.
</ngb-alert>
</p>
you can also use it as a service.