@@ -29,7 +29,17 @@ import {
29
29
ViewChild ,
30
30
ViewContainerRef
31
31
} from '@angular/core' ;
32
- import { EMPTY , fromEvent , interval , merge , Observable , of , Subject , Subscription } from 'rxjs' ;
32
+ import {
33
+ EMPTY ,
34
+ from ,
35
+ fromEvent ,
36
+ interval ,
37
+ merge ,
38
+ Observable ,
39
+ of ,
40
+ Subject ,
41
+ Subscription
42
+ } from 'rxjs' ;
33
43
import { debounceTime , filter , map , startWith , switchMap , takeUntil } from 'rxjs/operators' ;
34
44
import {
35
45
NguCarouselDefDirective ,
@@ -279,7 +289,7 @@ export class NguCarousel<T>
279
289
280
290
if ( isPlatformBrowser ( this . platformId ) ) {
281
291
this . _carouselInterval ( ) ;
282
- if ( ! this . vertical . enabled ) {
292
+ if ( ! this . vertical . enabled && this . inputs . touch ) {
283
293
this . _setupHammer ( ) ;
284
294
}
285
295
this . _setupWindowResizeListener ( ) ;
@@ -340,8 +350,12 @@ export class NguCarousel<T>
340
350
341
351
/** Get Touch input */
342
352
private _setupHammer ( ) : void {
343
- if ( this . inputs . touch ) {
344
- import ( 'hammerjs' ) . then ( ( ) => {
353
+ from ( import ( 'hammerjs' ) )
354
+ // Note: the dynamic import is always a microtask which may run after the view is destroyed.
355
+ // `takeUntil` is used to prevent setting Hammer up if the view had been destroyed before
356
+ // the HammerJS is loaded.
357
+ . pipe ( takeUntil ( this . _destroy$ ) )
358
+ . subscribe ( ( ) => {
345
359
const hammertime = ( this . _hammertime = new Hammer ( this . touchContainer . nativeElement ) ) ;
346
360
hammertime . get ( 'pan' ) . set ( { direction : Hammer . DIRECTION_HORIZONTAL } ) ;
347
361
@@ -392,7 +406,6 @@ export class NguCarousel<T>
392
406
ev . srcEvent . stopPropagation ( ) ;
393
407
} ) ;
394
408
} ) ;
395
- }
396
409
}
397
410
398
411
/** handle touch input */
0 commit comments