https://github.com/orchestratora/ngx-until-destroyed

🤓 RxJS operator that unsubscribes from observable on Angular component destruction
https://github.com/orchestratora/ngx-until-destroyed

angular components destroy operator rxjs unsubscribe

Last synced: 5 months ago
JSON representation

🤓 RxJS operator that unsubscribes from observable on Angular component destruction

• Host: GitHub
• URL: https://github.com/orchestratora/ngx-until-destroyed
• Owner: orchestratora
• License: mit
• Fork: true (gund/ngx-take-until-destroy)
• Created: 2019-01-16T20:08:23.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-01-17T01:15:43.000Z (over 6 years ago)
• Last Synced: 2025-01-02T13:09:11.762Z (5 months ago)
• Topics: angular, components, destroy, operator, rxjs, unsubscribe
• Language: TypeScript
• Homepage:
• Size: 431 KB
• Stars: 2
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
# 🤓 Angular - Unsubscribe For Pros 💪

[![Build Status](https://travis-ci.org/orchestratora/ngx-until-destroyed.svg?branch=master)](https://travis-ci.org/orchestratora/ngx-until-destroyed)

[![Coverage](https://img.shields.io/codecov/c/github/orchestratora/ngx-until-destroyed.svg?maxAge=2592000)](https://codecov.io/gh/orchestratora/ngx-until-destroyed)

[![Npm](https://img.shields.io/npm/v/@orchestrator/ngx-until-destroyed.svg)](https://www.npmjs.com/package/@orchestrator/ngx-until-destroyed)

[![Npm Downloads](https://img.shields.io/npm/dt/@orchestrator/ngx-until-destroyed.svg)](https://www.npmjs.com/package/@orchestrator/ngx-until-destroyed)

![Licence](https://img.shields.io/github/license/orchestratora/ngx-until-destroyed.svg)

[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)

> Declarative way to unsubscribe from observables when the component destroyed

## Installation

```bash

$ npm install @orchestrator/ngx-until-destroyed --save

```

## Usage

```ts

import { untilDestroyed } from '@orchestrator/ngx-until-destroyed';

@Component({

  selector: 'app-inbox',

  templateUrl: './inbox.component.html',

})

export class InboxComponent implements OnInit, OnDestroy {

  ngOnInit() {

    interval(1000)

      .pipe(untilDestroyed(this))

      .subscribe(val => console.log(val));

  }

  // This method must be present, even if empty.

  ngOnDestroy() {

    // To protect you, we'll throw an error if it doesn't exist.

  }

}

```

### Use with decorator

```ts

import { WithUntilDestroyed } from '@orchestrator/ngx-until-destroyed';

@Component({...})

class MyComponent implements OnDestroy {

  @WithUntilDestroyed()

  stream$ = interval(1000); // You can safely subscribe to this everywhere

  // This method must be present, even if empty

  ngOnDestroy() {}

}

```

### Use with any class

```ts

import { untilDestroyed } from '@orchestrator/ngx-until-destroyed';

export class Widget {

  constructor() {

    interval(1000)

      .pipe(untilDestroyed(this, 'destroy'))

      .subscribe(console.log);

  }

  // The name needs to be the same as the decorator parameter

  destroy() {}

}

```