Ng-lazyload-image: Perfect Scrollbar 플러그인에서는 작동하지 않습니다.

빠른 Angular 5 앱을 설정했는데 잘 작동하는 것 같습니다. - https://stackblitz.com/edit/angular-9guzc4?embed=1&file=app/app.component.html

이미지가 별도의 스크롤 컨테이너에 있는 경우 scrollTarget 를 사용해야 합니다. API 문서 또는 예제를 참조하십시오.

@vugar005 , 외부 div에 position: relative 스타일이 있음을 알 수 있습니다. position: absolute 이 div와 창 사이에 래퍼가 있습니까?

@sapierens @tjoskar. 감사 해요. Scroll Target을 추가하여 문제를 해결했습니다. 그러나 플러그인은 완벽한 스크롤바와 호환되지 않습니다.
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>

오버플로 자동을 사용하여 완벽한 스크롤 막대를 div로 변경했으며 예상대로 작동하지만 완벽한 스크롤 막대를 유지하고 싶습니다. 그래서 내가 한 일은 다음과 같습니다.
내가 이것을 위로할 때.scroll

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

따라서 this.scroll을 document.getElementById('main_content').children[0]; 문제가 완전히 해결되었습니다.
도움에 감사드립니다.

나는 perfect-scrollbar 사용한 적이 없지만 this.perfectScrollbar$ = Observable.fromEvent(document.getElementById('main_content'), 'ps-scroll-y') 를 사용한 다음 템플릿에서 다음을 사용할 수 있다고 생각합니다.

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

@tjoskar 불행히도 그것은 작동하지 않았습니다.
유일한 임시 해결책은 scrollTarget을 할당하는 것입니다.
document.getElementById('main_content').children[0];

문제를 재현할 수 있는 작은 gitrepo/stackblitz/plnkr을 만들 수 있습니까?

좋아, 곧 stackblitz에 추가하고 여기에 공유하겠습니다.

stackblitz 데모를 살펴보십시오.
https://stackblitz.com/edit/angular-wxyi2t

나는 다음과 같이 작동하도록 관리했습니다 - https://stackblitz.com/edit/angular-zovu45
그것이 최선의 해결책인지 확실하지 않습니다.

https://github.com/tjoskar/ng-lazyload-image/issues/275#issuecomment -356853681에서 제안한 @tjoskar 와 같이 해결할 수도 있지만 대신 Perfect-scrollbar를 지시문으로 사용해야 합니다. 작동하기 위한 구성 요소( https://github.com/zefoy/ngx-perfect-scrollbar#installing-and-usage 아래 DIRECTIVE USAGE ).

@sapierens 예 그것도 작동합니다. 거의 모든 프로젝트에서 완벽한 스크롤바를 사용합니다. 그것이 내가 그것을 작동시키기 위해 수입품이었던 이유입니다.고마워요.