Testing for an internet connection.

is-online.component.ts

import { Component } from '@angular/core';

@Component({
    template: `
        <h1>Is Online: {{ isOnline }}</h1>
        <span (click)="clickHandler()">Click Me</span>
    `,
})
export class MyComponent {
    private baseUrl = 'http://www.test.com';
    private isOnline = false;

    onlineCheck() {
        let xhr = new XMLHttpRequest();
        return new Promise((resolve, reject)=>{
            xhr.onload = () => {
                // Set online status
                this.isOnline = true;
                resolve(true);
            };
            xhr.onerror = () => {
                // Set online status
                this.isOnline = false;
                reject(false);
            };
            xhr.open('GET', this.baseUrl, true);
            xhr.send();
        });
    }

    clickHandler() {
        this.onlineCheck().then(() => {
            // Has internet connection, carry on 
        }).catch(() => {
            // Has no internet connection, let the user know
            alert('Sorry, no internet.');
        });
    }

    constructor() {
        // Run the initial online test
        this.onlineCheck();
    }
}