Moving to pipeable operators

src/lazyload-image.directive.ts

@@ -1,8 +1,6 @@
-import 'rxjs/add/operator/let';
-import 'rxjs/add/operator/switchMap';
-import 'rxjs/add/operator/debounceTime';
 import { Observable } from 'rxjs/Observable';
 import { ReplaySubject } from 'rxjs/ReplaySubject';
+import { switchMap, debounceTime } from 'rxjs/operators';
 import {
   AfterContentInit,
   Directive,
@@ -78,9 +76,9 @@ export class LazyLoadImageDirective implements OnChanges, AfterContentInit, OnDe
                 const windowTarget = isWindowDefined() ? window : undefined;
                 scrollObservable = getScrollListener(this.scrollTarget || windowTarget);
             }
-            this.scrollSubscription = this.propertyChanges$
-                .debounceTime(10)
-                .switchMap(props => scrollObservable.let(
+            this.scrollSubscription = this.propertyChanges$.pipe(
+                debounceTime(10),
+                switchMap(props => scrollObservable.pipe(
                     lazyLoadImage(
                         this.elementRef.nativeElement,
                         props.lazyImage,
@@ -91,7 +89,7 @@ export class LazyLoadImageDirective implements OnChanges, AfterContentInit, OnDe
                         props.scrollTarget
                     )
                 ))
-                .subscribe(success => this.onLoad.emit(success));
+            ).subscribe(success => this.onLoad.emit(success));
         });
     }
 

src/lazyload-image.ts

@@ -1,10 +1,12 @@
-import 'rxjs/add/operator/filter';
-import 'rxjs/add/operator/do';
-import 'rxjs/add/operator/take';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/mergeMap';
-import 'rxjs/add/operator/catch';
-import 'rxjs/add/observable/of';
+import {
+  filter,
+  tap,
+  take,
+  map,
+  mergeMap,
+  catchError,
+} from 'rxjs/operators';
+import { of } from 'rxjs/observable/of';
 import { Observable } from 'rxjs/Observable';
 import { getScrollListener } from './scroll-listener';
 import { Rect } from './rect';
@@ -116,17 +118,18 @@ export function lazyLoadImage(element: HTMLImageElement | HTMLDivElement, imageP
     }
 
     return (scrollObservable: Observable<Event>) => {
-        return scrollObservable
-            .filter(() => isVisible(element, offset, window, scrollContainer))
-            .take(1)
-            .mergeMap(() => loadImage(element, imagePath, useSrcset))
-            .do(() => setImageAndSourcesToLazy(element, imagePath, useSrcset))
-            .map(() => true)
-            .catch(() => {
+        return scrollObservable.pipe(
+            filter(() => isVisible(element, offset, window, scrollContainer)),
+            take(1),
+            mergeMap(() => loadImage(element, imagePath, useSrcset)),
+            tap(() => setImageAndSourcesToLazy(element, imagePath, useSrcset)),
+            map(() => true),
+            catchError(() => {
                 setImageAndSourcesToError(element, errorImgPath, useSrcset);
                 addCssClassName(element, cssClassNames.failed);
                 return Observable.of(false);
-            })
-            .do(() => addCssClassName(element, cssClassNames.loaded));
+            }),
+            tap(() => addCssClassName(element, cssClassNames.loaded))
+        );
     };
 }

src/scroll-listener.ts

@@ -1,17 +1,16 @@
-import 'rxjs/add/operator/startWith';
-import 'rxjs/add/operator/sampleTime';
-import 'rxjs/add/operator/share';
-import 'rxjs/add/observable/empty';
+import { startWith, sampleTime, share } from 'rxjs/operators';
+import { empty } from 'rxjs/observable/empty';
 import { Observable } from 'rxjs/Observable';
 import { isWindowDefined } from './utils';
 
 const scrollListeners = new WeakMap<any, Observable<any>>();
 
 export function sampleObservable(obs: Observable<any>, scheduler?: any) {
-    return obs
-        .sampleTime(100, scheduler)
-        .share()
-        .startWith('');
+    return obs.pipe(
+        sampleTime(100, scheduler),
+        share(),
+        startWith(''),
+    );
 }
 
 // Only create one scroll listener per target and share the observable.
@@ -21,7 +20,7 @@ export const getScrollListener = (scrollTarget): Observable<any> => {
         if (isWindowDefined()) {
             console.warn('`addEventListener` on ' + scrollTarget + ' (scrollTarget) is not a function. Skipping this target');
         }
-        return Observable.empty();
+        return empty();
     }
     if (scrollListeners.has(scrollTarget)) {
         return scrollListeners.get(scrollTarget);