1
1
import {
2
- ComponentFactoryResolver ,
3
2
ComponentRef ,
4
3
Directive ,
5
4
ElementRef ,
@@ -92,10 +91,9 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit {
92
91
} ;
93
92
94
93
constructor (
95
- @Inject ( DOCUMENT ) private document : any ,
94
+ @Inject ( DOCUMENT ) private document : Document ,
96
95
private renderer : Renderer2 ,
97
96
private hostElement : ElementRef ,
98
- private componentFactoryResolver : ComponentFactoryResolver ,
99
97
private viewContainerRef : ViewContainerRef ,
100
98
private listenersService : ListenersService
101
99
) { }
@@ -150,10 +148,7 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit {
150
148
151
149
private createTooltipElement ( ) : void {
152
150
if ( ! this . tooltipRef ) {
153
- const tooltipComponent =
154
- this . componentFactoryResolver . resolveComponentFactory ( TooltipComponent ) ;
155
- this . tooltipRef = tooltipComponent . create ( this . viewContainerRef . injector ) ;
156
- // this.tooltipRef = this.viewContainerRef.createComponent<TooltipComponent>(TooltipComponent);
151
+ this . tooltipRef = this . viewContainerRef . createComponent < TooltipComponent > ( TooltipComponent ) ;
157
152
// this.viewContainerRef.detach();
158
153
}
159
154
}
@@ -164,8 +159,8 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit {
164
159
// @ts -ignore
165
160
this . tooltipRef = undefined ;
166
161
this . popperInstance ?. destroy ( ) ;
167
- this . viewContainerRef . detach ( ) ;
168
- this . viewContainerRef . clear ( ) ;
162
+ this . viewContainerRef ? .detach ( ) ;
163
+ this . viewContainerRef ? .clear ( ) ;
169
164
}
170
165
171
166
private addTooltipElement ( ) : void {
@@ -174,36 +169,46 @@ export class TooltipDirective implements OnChanges, OnDestroy, OnInit {
174
169
}
175
170
this . tooltipRef . instance . content = this . content ;
176
171
this . tooltip = this . tooltipRef . location . nativeElement ;
172
+ this . renderer . addClass ( this . tooltip , 'd-none' ) ;
177
173
this . renderer . addClass ( this . tooltip , 'fade' ) ;
178
174
175
+ this . popperInstance ?. destroy ( ) ;
176
+
179
177
setTimeout ( ( ) => {
180
178
this . popperInstance = createPopper (
181
179
this . hostElement . nativeElement ,
182
180
this . tooltip ,
183
181
{ ...this . popperOptions }
184
182
) ;
185
183
this . viewContainerRef . insert ( this . tooltipRef . hostView ) ;
184
+ this . renderer . appendChild ( this . document . body , this . tooltip ) ;
185
+ if ( ! this . visible ) {
186
+ this . removeTooltipElement ( ) ;
187
+ return ;
188
+ }
186
189
setTimeout ( ( ) => {
187
190
this . tooltipId = this . getUID ( 'tooltip' ) ;
188
191
this . tooltipRef . instance . id = this . tooltipId ;
192
+ if ( ! this . visible ) {
193
+ this . removeTooltipElement ( ) ;
194
+ return ;
195
+ }
196
+ this . renderer . removeClass ( this . tooltip , 'd-none' ) ;
189
197
this . tooltipRef . instance . visible = this . visible ;
190
- this . renderer . appendChild ( this . document . body , this . tooltip ) ;
191
198
this . popperInstance . forceUpdate ( ) ;
192
- // this.tooltipRef.changeDetectorRef.markForCheck();
193
199
} , 100 ) ;
194
200
} ) ;
195
201
}
196
202
197
203
private removeTooltipElement ( ) : void {
204
+ this . tooltipId = '' ;
198
205
if ( ! this . tooltipRef ) {
199
206
return ;
200
207
}
201
208
this . tooltipRef . instance . visible = this . visible ;
202
209
this . tooltipRef . instance . id = undefined ;
203
210
setTimeout ( ( ) => {
204
- this . viewContainerRef . detach ( ) ;
205
- this . popperInstance ?. destroy ( ) ;
206
- this . tooltipId = '' ;
211
+ this . viewContainerRef ?. detach ( ) ;
207
212
} , 300 ) ;
208
213
}
209
214
}
0 commit comments