@@ -3,19 +3,20 @@ import {
33Component ,
44ComponentRef ,
55ContentChildren ,
6+ DestroyRef ,
67ElementRef ,
78HostBinding ,
9+ inject ,
810Injector ,
911Input ,
1012NgModuleRef ,
11- OnDestroy ,
1213OnInit ,
1314QueryList ,
1415Renderer2 ,
1516ViewChild ,
1617ViewContainerRef
1718} from '@angular/core' ;
18- import { Subscription } from 'rxjs' ;
19+ import { takeUntilDestroyed } from '@angular/core/ rxjs-interop ' ;
1920
2021import { IToasterAction , ToasterService } from './toaster.service' ;
2122import { ToasterHostDirective } from './toaster-host.directive' ;
@@ -54,9 +55,16 @@ export type TToasterPlacement =
5455standalone :true ,
5556imports :[ ToasterHostDirective ]
5657} )
57- export class ToasterComponent implements OnDestroy , OnInit , AfterContentChecked {
58+ export class ToasterComponent implements OnInit , AfterContentChecked {
59+
60+ readonly #destroyRef= inject ( DestroyRef ) ;
61+
62+ constructor (
63+ private hostElement :ElementRef ,
64+ private renderer :Renderer2 ,
65+ private toasterService :ToasterService
66+ ) { }
5867
59- stateToasterSubscription ! :Subscription ;
6068placements = Object . values ( ToasterPlacement ) ;
6169toasts ! :QueryList < ViewContainerRef > ;
6270toastsDynamic :any [ ] = [ ] ;
@@ -76,12 +84,6 @@ export class ToasterComponent implements OnDestroy, OnInit, AfterContentChecked
7684 @ViewChild ( ToasterHostDirective , { static :true } ) toasterHost ! :ToasterHostDirective ;
7785 @ContentChildren ( ToastComponent , { read :ViewContainerRef } ) contentToasts ! :QueryList < ViewContainerRef > ;
7886
79- constructor (
80- private hostElement :ElementRef ,
81- private renderer :Renderer2 ,
82- private toasterService :ToasterService
83- ) { }
84-
8587 @HostBinding ( 'class' )
8688get hostClasses ( ) :any {
8789return {
@@ -101,18 +103,14 @@ export class ToasterComponent implements OnDestroy, OnInit, AfterContentChecked
101103}
102104
103105ngOnInit ( ) :void {
104- this . stateToasterSubscribe ( true ) ;
105- }
106-
107- ngOnDestroy ( ) :void {
108- this . stateToasterSubscribe ( false ) ;
106+ this . stateToasterSubscribe ( ) ;
109107}
110108
111109ngAfterContentChecked ( ) :void {
112110this . toasts = this . contentToasts ;
113111}
114112
115- addToast ( toast :any , props :any , options ?:{
113+ public addToast ( toast :any , props :any , options ?:{
116114index ?:number ;
117115injector ?:Injector ;
118116ngModuleRef ?:NgModuleRef < unknown > ;
@@ -133,7 +131,7 @@ export class ToasterComponent implements OnDestroy, OnInit, AfterContentChecked
133131return componentRef ;
134132}
135133
136- removeToast ( state :IToasterAction ) :void {
134+ public removeToast ( state :IToasterAction ) :void {
137135this . toastsDynamic ?. forEach ( item => {
138136if ( state . toast ?. dynamic && ( item . instance === state . toast ) ) {
139137item . instance . visible = false ;
@@ -143,26 +141,25 @@ export class ToasterComponent implements OnDestroy, OnInit, AfterContentChecked
143141} ) ;
144142
145143this . toasts ?. forEach ( item => {
146- if ( item . element . nativeElement === state . toast ?. hostElement . nativeElement ) {
147- if ( ! state . toast ?. dynamic ) {
148- //@ts -ignore
144+ if ( state . toast && ( item . element . nativeElement === state . toast . hostElement . nativeElement ) ) {
145+ if ( ! state . toast . dynamic ) {
149146state . toast . visible = false ;
150147}
151148}
152149} ) ;
153150}
154151
155- private stateToasterSubscribe ( subscribe :boolean = true ) :void {
156- if ( subscribe ) {
157- this . stateToasterSubscription = this . toasterService . toasterState$ . subscribe ( ( state ) => {
152+ private stateToasterSubscribe ( ) :void {
153+ this . toasterService . toasterState$
154+ . pipe (
155+ takeUntilDestroyed ( this . #destroyRef)
156+ )
157+ . subscribe ( ( state ) => {
158158if ( state . show === false ) {
159159this . removeToast ( state ) ;
160160}
161161if ( state . show === true && state . toast ?. dynamic === undefined ) {
162162}
163163} ) ;
164- } else {
165- this . stateToasterSubscription ?. unsubscribe ( ) ;
166- }
167164}
168165}