# ngoffline2

> This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.2.10.

Latest version **14.1.0** (published 2021-10-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install ngoffline2
pnpm add ngoffline2
yarn add ngoffline2
bun add ngoffline2
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 14.1.0 |
| Published | 2021-10-21 |
| First published | 2021-10-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 127.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Anass Azeroual |
| Maintainers | devtips |
| Keywords | offline, connexion, devtips, ngoffline, network, angular, service |

## Links

- npm: https://www.npmjs.com/package/ngoffline2
- Repository: https://github.com/AnassAzeroual/ng-offline-lib
- Homepage: https://github.com/AnassAzeroual/ng-offline-lib#readme
- Issues: https://github.com/AnassAzeroual/ng-offline-lib/issues
- npm.io page: https://npm.io/package/ngoffline2

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.3.0

## Recent versions

- 14.1.0 (latest) — 2021-10-21
- 14.0.0 — 2021-10-21

## README

# NgOffLine

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.2.10.

## Table of Contents

- [About](#About)
- [Imports](#Imports)
- [Usage](#Usage)

## About
> this package used to detect **offline/online** status and **show/hide** messages based on network status 
## Imports 

```js

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


```

## Usage

```html

<ngoffline></ngoffline>

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

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

```
> You can use **directive** to display or hide any html selector 

```html

<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**

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

```
> Or in the directive

```html

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

```

---
_Source: https://npm.io/package/ngoffline2 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._