Ng-lazyload-image: لا تعمل صورة التحميل الكسول مع التمهيد المسبق

مرحبًا @ lares83 ،

شكرا على إعلامي. هذه مشكلة صعبة للغاية لأنه لا توجد طريقة لمعرفة متى تصبح الصورة مرئية.

الإصلاح السريع هو تعيين offset=1 كما تقترح ولكن هذا سيؤدي إلى تحميل جميع الصور عندما تصبح مرئية ، حتى لو لم تكن موجودة في منفذ العرض. هذا لأن ng-lazyload-image ليس لديه طريقة لمعرفة مكان الصورة قبل أن تصبح مرئية وفي ذلك الوقت فات الأوان (لن نحصل على حدث جديد حتى يقوم المستخدم بالتمرير).

تتمثل إحدى طرق إصلاحه في الاستماع إلى حدث PrebootComplete :

constructor() {
  this.scrollAndPrebootComplete$ = Observable.merge(
    Observable.fromEvent(window, 'scroll'),
    Observable.fromEvent(window, 'PrebootComplete')
  );
}

ثم في النموذج:

<img [lazyLoad]="lazyLoadImage" [scrollObservable]="scrollAndPrebootComplete$" />

يمكنك بسهولة إنشاء مكون مخصص يلتف حول lazyLoad ويمرر scrollAndPrebootComplete$ .

حل آخر هو استخدام IntersectionObserver لكن هذا يتطلب # 304 ليتم حلها.

الحل السريع هو تعيين سمة الإزاحة على سبيل المثال 1 مما يجعل intersectsWith العودة صحيحة.

هذا في الواقع خطأ ، لا ينبغي أن يحدث. سأفتح قضية منفصلة لذلك.

أنا أغلق هذا. اسمحوا لي أن أعرف أن الحل المقترح أعلاه لم ينجح.