Ng-lazyload-image: Funktioniert nicht mit dem Perfect Scrollbar-Plugin.

Ich habe eine schnelle Angular 5-App eingerichtet, die bei mir anscheinend gut funktioniert - https://stackblitz.com/edit/angular-9guzc4?embed=1&file=app/app.component.html

Wenn sich Ihre Bilder in einem separaten Scroll-Container befinden, müssen Sie scrollTarget . Weitere Informationen finden Sie in der API-Dokumentation oder in den Beispielen .

@vugar005 , ich sehe, dass Ihr äußeres Div den position: relative Stil hat. Haben Sie einen Wrapper zwischen diesem div und dem Fenster mit position: absolute ?

@sapierens @tjoskar. Vielen Dank. Das Problem wurde durch das Hinzufügen von Scroll Target behoben. Aber das Plugin ist nicht mit der perfekten Scrollbar kompatibel.
in TS
this.scroll = document.getElementById('main_content');

<perfect-scrollbar id="main_content">
  <div class="content d-flex flex-wrap"  style="position: relative"  #sc>
         <div class="brick" *ngFor="let employee of employees">
           <div class="employeeBox animated zoomIn " [routerLink]="['/employees', employee.id]">
             <div class="employeePhoto">
               <img    [defaultImage]="'assets/icons/user.svg'"
                       [lazyLoad]="employee.imgUrl"
                       [useSrcset]="true"
                       [scrollTarget]="scroll"
               >
             </div>
             <div class="employeeInfo">
               <p>{{employee.name}}</p>
             </div>
           </div>
         </div>
       </div>
</perfect-scrollbar>

Die perfekte Bildlaufleiste wurde in div mit Überlaufautomatik geändert und es funktioniert wie erwartet, aber ich möchte die perfekte Bildlaufleiste beibehalten. Also was ich gemacht habe ist:
Wenn ich das tröste.scroll

<perfect-scrollbar id="main_content"  >
   <div style="position:static"  class="ps" ng-reflect-disabled=false> ... </div>
</perfect-scrollbar>

Durch Zuweisen von this.scroll zu document.getElementById('main_content').children[0]; Problem ist vollständig gelöst.
Danke für die Hilfe.

Ich habe noch nie perfect-scrollbar aber ich denke, Sie könnten this.perfectScrollbar$ = Observable.fromEvent(document.getElementById('main_content'), 'ps-scroll-y') und dann in Ihrer Vorlage:

<img [defaultImage]="'assets/icons/user.svg'"
     [lazyLoad]="employee.imgUrl"
     [useSrcset]="true"
     [scrollObservable]="perfectScrollbar$">

@tjoskar Das hat leider nicht funktioniert.
Die einzige temporäre Lösung besteht darin, scrollTarget zu zuweisen
document.getElementById('main_content').children[0];

Können Sie ein kleines gitrepo/stackblitz/plnkr erstellen, in dem Sie das Problem reproduzieren können?

okay, ich werde demnächst zu stackblitz hinzufügen und hier teilen.

Bitte sehen Sie sich die Stackblitz-Demo an:
https://stackblitz.com/edit/angular-wxyi2t

Ich habe es geschafft, dass es so funktioniert - https://stackblitz.com/edit/angular-zovu45
Bin mir aber nicht sicher ob das die beste Lösung ist.

Es ist auch möglich, es zu lösen, wie @tjoskar in https://github.com/tjoskar/ng-lazyload-image/issues/275#issuecomment -356853681 vorgeschlagen hat, aber Sie müssten perfect-scrollbar anstelle von eine Komponente, damit es funktioniert (https://github.com/zefoy/ngx-perfect-scrollbar#installing-and-usage unter DIRECTIVE USAGE ).

@sapierens Ja, es funktioniert auch. Ich verwende in fast jedem Projekt die perfekte Scrollbar. Deshalb war es wichtig für mich, es zum Laufen zu bringen. Danke.