Ng-lazyload-image: Ionic 2 - не работает в директиве "ion-card"

Созданный на 22 авг. 2017  ·  11Комментарии  ·  Источник: tjoskar/ng-lazyload-image

Всем привет,

Я столкнулся с этой проблемой с Ionic 2:

По сути, происходит то, что когда тег img находится внутри директивы ion-card, изображение вообще не загружается, оно показывает только «defaultImage». Позиционируя изображение вне ионной карты, все работает нормально.

Пожалуйста, дайте мне знать, сможете ли вы взглянуть на это.

in place.ts
...
export class PlacePage {

defaultImage: string = ' http://via.placeholder.com/350x150 ';
место: любое = {
imgUrl: ' https://encrypted-tbn0.gstatic.com/images?q=tbn : ANd9GcSSCP8YYYuzKCXQLhQ7mkH5I_VpZ0v23BWrJ4QkxSSldl7sOV__xKA'
};

constructor () {
}

...
}

in place.html:
<ion-card> <img [defaultImage]="defaultImage" [lazyLoad]="place.imgUrl" /> ..... </ion-card>

Спасибо

Wait for feedback

Все 11 Комментарий

Привет,

Находится ли ion-cord внутри какого-либо представления или чего-то еще, что имеет собственный контейнер прокрутки? Не могли бы вы поделиться своим мнением?

Спасибо за быстрый ответ.

Вот что в основном имеет моя точка зрения:

** все это завернуто в "ion-content", но по какой-то причине здесь не форматируется должным образом.



    <ion-card-content>
        <ion-card-title>
            <div>{{place.name}}</div>
        </ion-card-title>
        <div>
            Some content here ....
        </div>
    </ion-card-content>
</ion-card>

Я думаю, что ion-content может быть проблемой. ng-lazyload-image используют window по умолчанию для событий прокрутки, но ion-content используют свой собственный контейнер прокрутки, поэтому нам нужно прослушивать событие прокрутки на ion-content .

Можете попробовать использовать следующий шаблон:

<ion-content #container>
  <ion-card>
    <img defaultImage]="defaultImage" [lazyLoad]="place.imgUrl" [scrollTarget]="container.scrollElement" />
    you content
  </ion-card>
</ion-content>

Спасибо, что изучили это,

Я пробовал использовать предоставленный код, но без разницы, я думаю, что ионное содержимое не является проблемой, и может быть ионная карта, потому что, если вы возьмете тег img за пределы ионной карты, он будет работать нормально.

Вы пытались воспроизвести это со своей стороны? Я мог бы поделиться проектом в битбакете, если вы этого не сделали.

Спасибо

Хм, ладно. Да, было бы здорово, если бы я мог получить доступ к вашему проекту :) Я использую tjoskar качестве имени пользователя на bitbucket, если это закрытый проект.

Вы решили проблему? Я закрою этот выпуск сейчас, но не стесняйтесь открывать его снова.

У меня аналогичная проблема, которая может быть связана с бесконечной прокруткой. Мой проект в разработке - http://veterinary.communityone.com , вам нужно будет создать логин, чтобы увидеть контент, а затем после входа в систему нажать на социальную ленту на боковой панели. На начальной странице изображение отображается нормально, но после начала бесконечной прокрутки первое изображение возвращается к прядильщику и больше никогда не появляется.

capture

@jcbowyer , я только что создал учетную запись, но не смог воспроизвести проблему. Я всего три поста и ни одной бесконечной прокрутки не получил.

Спасибо. В конце концов я кое-что изменил, и все заработало. Я не совсем уверен, что это исправило

@tjoskar Здесь

@jeffreyramia , та же проблема? Вы тоже используете ionic и ion-card ? Можете ли вы открыть новую проблему, описать проблему и, возможно, поделиться кодом?

Была ли эта страница полезной?
0 / 5 - 0 рейтинги