I had this online/offline observable and I needed it on my component. This was the snippet I used to show things dependent on my online/offline state:
<div *ngIf="(online$ | async) != false">
Hi, I'm online!
</div>
<div *ngIf="(online$ | async) === false">
Oops, I'm offline
</div>
For this, I use the Network class from @ngx-pwa/offline. This is my Home component:
import {Component} from '@angular/core';
import {Network} from "@ngx-pwa/offline";
@Component({
selector: 'app-home',
templateUrl: 'home.page.html'
})
export class HomePage {
public online$ = this.network.onlineChanges;
constructor(
protected network: Network
) {
}
}