Merge pull request #60 from cat-mandres/fix-on-push

Manually trigger change detection after loading an image to support ChangeDetectionStrategy.OnPush

Author: thatisuday

src/projects/ngx-image-gallery/src/lib/components/ngx-image-gallery/ngx-image-gallery.component.ts

@@ -10,7 +10,8 @@ import {
     Output,
     OnChanges,
     SimpleChanges,
-    ViewChild
+    ViewChild,
+    ChangeDetectorRef
 } from '@angular/core';
 
 import {assign, debounce} from 'lodash';
@@ -181,14 +182,16 @@ export class NgxImageGalleryComponent implements OnInit, OnChanges {
         this.loadImage(imageIndex)
             .then(_imageIndex => {
                 this.activeImageIndex = _imageIndex;
+                // Trigger change detection manually to support ChangeDetectionStrategy.OnPush
+                this.cdRef.detectChanges();
 
                 // scroll thumbnails
                 setTimeout(() => {
                     this.fitThumbnails();
                     setTimeout(() => this.scrollThumbnails(), 300);
                 });
             })
-            .catch(error => { 
+            .catch(error => {
                 console.warn(error)
                 this.onError.next(error);
             });
@@ -223,7 +226,8 @@ export class NgxImageGalleryComponent implements OnInit, OnChanges {
     constructor(
         public sanitizer: DomSanitizer,
         private galleryElem: ElementRef,
-        private renderer: Renderer2
+        private renderer: Renderer2,
+        private cdRef: ChangeDetectorRef
     ) {}
 
     ngOnInit() {
@@ -265,7 +269,7 @@ export class NgxImageGalleryComponent implements OnInit, OnChanges {
         }
 
     }
-    
+
     // keyboard event
     @HostListener('window:keydown', ['$event'])
     public onKeyboardInput(event: KeyboardEvent) {