Ng-lazyload-image: 'आलसीलोड' से नहीं जुड़ सकता क्योंकि यह एक ज्ञात मूल संपत्ति नहीं है

नमस्ते,

मैं समस्या का पुनरुत्पादन नहीं कर सकता। आप ng2-lazyload-image का किस संस्करण का उपयोग कर रहे हैं? क्या आपका प्रोजेक्ट ओपन सोर्स है इसलिए मैं इसे देख सकता हूं?

मैंने जो कदम उठाए:

$ npm install -g ionic<strong i="8">@beta</strong>
$ ionic --version
2.0.0-beta.37
$ ionic start ionic-lazy-load-images --v2
$ cd ionic-lazy-load-images
$ npm install [email protected] --save
$ ionic serve

कोड अपडेट किया गया:

`एप्लिकेशन/पेज/होम/होम.एचटीएमएल:

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding class="home" #container>
  <h2>Welcome to Ionic!</h2>
  <p>
    This starter project comes with simple tabs-based layout for apps
    that are going to primarily use a Tabbed UI.
  </p>
  <p style="height: 1000px;">
    Take a look at the <code>app/</code> directory to add or change tabs,
    update any existing page or create new pages.
  </p>
  <img
    style="height: 1099px;"
    [src]="defaultImage"
    [lazyLoad]="image"
    [offset]="offset"
    [scrollTarget]="container._scroll._el">
</ion-content>

`एप्लिकेशन/पेज/होम/होम.टीएस:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { LazyLoadImageDirective } from 'ng2-lazyload-image';

@Component({
  templateUrl: 'build/pages/home/home.html',
  directives: [ LazyLoadImageDirective ]
})
export class HomePage {
  defaultImage = 'https://www.placecage.com/1000/1000';
  image = 'https://hd.unsplash.com/photo-1441765425173-8fd330fb4a02';
  offset = 100;

  constructor(private navCtrl: NavController) {
  }
}

और यह ठीक काम करता है :)

हालांकि, चूंकि आयनिक टैब (प्रति डिफ़ॉल्ट) का उपयोग कर रहा है और स्क्रॉल कंटेनर पर display: none जोड़ रहा है, इससे यह निर्धारित करना लगभग असंभव हो जाता है कि छवि प्रारंभ में व्यूपोर्ट में है या नहीं। चौराहे पर्यवेक्षक जैसे कुछ का उपयोग करना अच्छा होना चाहिए लेकिन यह केवल क्रोम में काम करता है और यदि आप आईओएस को लक्षित करते हैं तो आप सफारी का उपयोग करने जा रहे हैं: /

हालांकि एक समाधान यह जांचना है कि क्या छवि छिपी हुई है (उदाहरण: el.offsetParent === null ) लेकिन जब छवि फिर से दिखाई देती है, तो ng2-lazyload-image को कोई सूचना प्राप्त नहीं होगी और यदि छवि व्यूपोर्ट में है, तो उपयोगकर्ता स्क्रॉल करना शुरू करने से पहले छवि दिखाई नहीं देगी। हालाँकि आप उसके लिए *ngIf उपयोग कर सकते हैं:

<img
    *ngIf="container._scroll._el.offsetParent !== null"
    style="height: 1099px;"
    [src]="defaultImage"
    [lazyLoad]="image"
    [offset]="offset"
    [scrollTarget]="container._scroll._el">

लेकिन यह अच्छा नहीं लगता: /

तो .. आप अपने आयनिक ऐप (आपके लेआउट के आधार पर) में ng2-lazyload-image का उपयोग करने में सक्षम हो सकते हैं या नहीं, लेकिन आपको कोई रनटाइम त्रुटि नहीं मिलनी चाहिए।

आपने एक टाइपो बनाया।
यह [आलसी लोड] है, नहीं [आलसी लोड]

चीयर्स :)

यह शर्मनाक सरल लगता है।
मैं rc1 में अपग्रेड करूँगा और इसे आज़माऊँगा। धन्यवाद।

सोम, अक्टूबर 17, 2016 अपराह्न 1:37 बजे, स्टेन फास नोटिफिकेशन @github.com ने लिखा:

आपने एक टाइपो बनाया।
यह [आलसी लोड] है, नहीं [आलसी लोड]

चीयर्स :)

-
आप इसे प्राप्त कर रहे हैं क्योंकि आपने सूत्र को लिखा है।
इस ईमेल का सीधे उत्तर दें, इसे GitHub पर देखें
https://github.com/tjoskar/ng2-lazyload-image/issues/37#issuecomment -254195387,
या थ्रेड को म्यूट करें
https://github.com/notifications/unsubscribe-auth/APPh0par6NR7EA3DA1GbibncX8gCb2YRks5q02wTgaJpZM4J5EjU
.

@StanFaas , अच्छी पकड़!

मुझे वही त्रुटि मिल रही है मैं इसे कैसे हल कर सकता हूं।