About angular-destroyref
A skill reference for managing Angular resource cleanup with DestroyRef, aimed at Angular developers. It shows how to use takeUntilDestroyed in components and services to end observable subscriptions with their lifecycle.
Key features
- 01Use takeUntilDestroyed
- 02Clean up component subscriptions
- 03Apply cleanup in services
Use cases
- 01End subscriptions with a component lifecycle
- 02Manage observable cleanup in a service
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ oguzhan18/ angular-ecosystem-skills --skill angular-destroyrefAfter installing, type/angular-destroyrefin Claude Code to confirm it loaded.
Bundled files
References and scripts installed along with SKILL.md.
references/discussions/_INDEX.mdreferences/docs/_INDEX.mdreferences/issues/_INDEX.mdreferences/releases/_INDEX.mdDetails
From the project READMEAngular DestroyRef
Version: Angular 16+ (2025) Tags: DestroyRef, Cleanup, takeUntilDestroyed
References: DestroyRef
Best Practices
- Use takeUntilDestroyed
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@Component({})
export class MyComponent {
private destroyRef = inject(DestroyRef);
ngOnInit() {
this.data$.pipe(
takeUntilDestroyed(this.destroyRef)
).subscribe();
}
}
- Use in service
@Injectable({ providedIn: 'root' })
export class DataService {
private destroyRef = inject(DestroyRef);
getData() {
return this.http.get('/api/data').pipe(
takeUntilDestroyed(this.destroyRef)
);
}
}
Comments
Markdown supported