Ng-lazyload-image: Невозможно выполнить привязку к 'lazyload', поскольку это не известное собственное свойство

Привет,

Я не могу воспроизвести проблему. Какую версию 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

Обновил код:

`app / pages / home / home.html:

<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>

`приложение / страницы / дом / home.ts:

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) {
  }
}

И работает нормально :)

ОДНАКО, поскольку ionic использует вкладки (по умолчанию) и добавляет display: none в контейнер прокрутки, практически невозможно определить, находится ли изображение изначально в области просмотра или нет. Было бы неплохо использовать что-то вроде наблюдателя пересечения, но он работает только в Chrome, и если вы ориентируетесь на iOS, вы собираетесь использовать Safari: /

Однако одно из решений - проверить, скрыто ли изображение (например: 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 в своем ионном приложении (в зависимости от вашего макета), но вы не должны получать никаких ошибок времени выполнения.

Вы допустили опечатку.
Это [lazyLoad], а не [lazyload]

Ваше здоровье :)

Звучит до неприличия просто.
Я буду обновляться до rc1 и попробую. Спасибо.

В понедельник, 17 октября 2016 г., в 13:37 Стэн Фаас [email protected] написал:

Вы допустили опечатку.
Это [lazyLoad], а не [lazyload]

Ваше здоровье :)

-
Вы получаете это, потому что вы являетесь автором темы.
Ответьте на это письмо напрямую, просмотрите его на GitHub
https://github.com/tjoskar/ng2-lazyload-image/issues/37#issuecomment -254195387,
или отключить поток
https://github.com/notifications/unsubscribe-auth/APPh0par6NR7EA3DA1GbibncX8gCb2YRks5q02wTgaJpZM4J5EjU
.

@StanFaas , хороший улов!

У меня такая же ошибка, как ее решить.