NgOffLine

This project was generated with Angular CLI version 12.2.10.

Table of Contents

• About
• Imports
• Usage

About

this package used to detect offline/online status and show/hide messages based on network status

Imports

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    ...
    NgofflineModule // <--- here
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Usage

<ngoffline></ngoffline>

The default message is You are not connected, but you can change it

<ngoffline message="Custom message"></ngoffline>

You can use directive to display or hide any html selector

<div ngoffline>
  this message will be displayed only if the status is offline
</div>

<div ngonline>
  this message will be displayed only if the status is online
</div>

Network status output return false if the status Offline

<ngoffline (isOnline)="checkNetworkStatus($event)"></ngoffline>

Or in the directive

<div (isOnline)="checkNetworkStatus($event)">
  this message will be displayed only if the status is offline
</div>