https://github.com/navneetlal/ng-offline

Angular directive which checks whether network connectivity is available or not.
https://github.com/navneetlal/ng-offline

angular directive library network-connection offline

Last synced: 7 days ago
JSON representation

Angular directive which checks whether network connectivity is available or not.

• Host: GitHub
• URL: https://github.com/navneetlal/ng-offline
• Owner: navneetlal
• License: mit
• Created: 2020-01-24T12:00:52.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T14:04:57.000Z (over 2 years ago)
• Last Synced: 2025-04-21T06:58:34.194Z (about 1 month ago)
• Topics: angular, directive, library, network-connection, offline
• Language: TypeScript
• Homepage:
• Size: 3.55 MB
• Stars: 0
• Watchers: 2
• Forks: 1
• Open Issues: 27
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![GitHub license](https://img.shields.io/github/license/navneetlal/ng-offline?style=flat-square)](https://github.com/navneetlal/ng-offline/blob/master/LICENSE)

![npm](https://img.shields.io/npm/v/ng-offline?color=blue&style=flat-square)

# NgOffline

A simple angular module which enables directives `ngOnline` and `ngOffline` to make conditional rendering of component based on network status.

### Installing

```bash

$ npm install ng-offline --save

```

### Basic usage

Import `NgOfflineModule` into your ngModule and start using directives `ngOnline` and `ngOffline` within your html component.

##### **`app.module.ts`**

```ts

import { BrowserModule } from '@angular/platform-browser';

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

import { NgOfflineModule } from 'ng-offline';

import { AppComponent } from './app.component';

@NgModule({

  declarations: [

    AppComponent

  ],

  imports: [

    BrowserModule,

    NgOfflineModule

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

```

##### **`app.component.html`**

```html

Hey! You are online

You're offline. Check your connection!

```


First div container will only be visible when network status in online and second div will be visible after network status in offline.

### License

Published under the [MIT License](https://github.com/navneetlal/react-offline-component/blob/master/LICENSE).