@@ -2,9 +2,11 @@ import {
2
2
AfterViewInit ,
3
3
ChangeDetectorRef ,
4
4
ComponentRef ,
5
+ DestroyRef ,
5
6
Directive ,
6
7
ElementRef ,
7
8
HostBinding ,
9
+ inject ,
8
10
Inject ,
9
11
Input ,
10
12
OnChanges ,
@@ -15,9 +17,9 @@ import {
15
17
TemplateRef ,
16
18
ViewContainerRef
17
19
} from '@angular/core' ;
20
+ import { takeUntilDestroyed } from '@angular/core/rxjs-interop' ;
18
21
import { DOCUMENT } from '@angular/common' ;
19
- import { Subscription } from 'rxjs' ;
20
- import { debounceTime } from 'rxjs/operators' ;
22
+ import { debounceTime , finalize } from 'rxjs/operators' ;
21
23
import { createPopper , Instance , Options } from '@popperjs/core' ;
22
24
23
25
import { Triggers } from '../coreui.types' ;
@@ -96,7 +98,7 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit, AfterView
96
98
]
97
99
} ;
98
100
99
- private intersectingSubscription ?: Subscription ;
101
+ readonly #destroyRef = inject ( DestroyRef ) ;
100
102
101
103
constructor (
102
104
@Inject ( DOCUMENT ) private document : Document ,
@@ -109,7 +111,6 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit, AfterView
109
111
) { }
110
112
111
113
ngAfterViewInit ( ) : void {
112
- this . intersectionService . createIntersectionObserver ( this . hostElement ) ;
113
114
this . intersectionServiceSubscribe ( ) ;
114
115
}
115
116
@@ -122,7 +123,6 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit, AfterView
122
123
ngOnDestroy ( ) : void {
123
124
this . clearListeners ( ) ;
124
125
this . destroyTooltipElement ( ) ;
125
- this . intersectionServiceSubscribe ( false ) ;
126
126
}
127
127
128
128
ngOnInit ( ) : void {
@@ -154,18 +154,19 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit, AfterView
154
154
}
155
155
156
156
private intersectionServiceSubscribe ( subscribe : boolean = true ) : void {
157
- if ( subscribe ) {
158
- this . intersectingSubscription = this . intersectionService . intersecting$
159
- . pipe (
160
- debounceTime ( 100 )
161
- )
162
- . subscribe ( isIntersecting => {
163
- this . visible = isIntersecting ? this . visible : false ;
164
- ! this . visible && this . removeTooltipElement ( ) ;
165
- } ) ;
166
- } else {
167
- this . intersectingSubscription ?. unsubscribe ( ) ;
168
- }
157
+ this . intersectionService . createIntersectionObserver ( this . hostElement ) ;
158
+ this . intersectionService . intersecting$
159
+ . pipe (
160
+ debounceTime ( 100 ) ,
161
+ finalize ( ( ) => {
162
+ this . intersectionService . unobserve ( this . hostElement ) ;
163
+ } ) ,
164
+ takeUntilDestroyed ( this . #destroyRef)
165
+ )
166
+ . subscribe ( isIntersecting => {
167
+ this . visible = isIntersecting ? this . visible : false ;
168
+ ! this . visible && this . removeTooltipElement ( ) ;
169
+ } ) ;
169
170
}
170
171
171
172
private getUID ( prefix : string ) : string {
0 commit comments