2017-02-14 18 views
0

Я использую ng-infin-scroll.js, функция прокрутки отлично работает на ПК. Когда приходит к мобильному/отзывчивому виду, он не загружает какие-либо элементы во время прокрутки вниз.ng бесконечная прокрутка с угловыми js не работает в режиме ожидания и мобильных устройствах

<div class="row" infinite-scroll="loadMore('{!! slug !!}','{!! code !!}')" infinite-scroll-disabled='busy' infinite-scroll-distance='1'> 

-------contents list---------- 

</div> 

В мобильном режиме просмотра даже не попадает внутрь метода $ scope.loadMore.

Дайте мне знать, если есть решение проблемы. Заранее спасибо.

+0

Как вы отлаживаете свое приложение? поместите ** инструкцию ** ** в метод loadMore, проверьте, является ли она вызовом или нет. –

+0

@Gangadhar Jannu, вот как я узнал - предупреждение не регистрируется внутри loadMore при переходе на мобильный вид. –

+0

Привет, Глен! Кажется, я столкнулся с той же проблемой. Вы нашли какое-либо решение своей проблемы? –

ответ

1

Я сделал несколько шагов для решения этой проблемы. Первое, что я сделал, - это обновленная бесконечная прокрутка js до версии ng-infin-scroll - v1.2.0.

Для фиксации проблемы я обновил код, добавив бесконечную улитку-контейнер, как показано ниже:

<div id="infi-scroll"> 
    <div class="row" infinite-scroll="loadMore('{!! slug !!}','{!! code !!}')" infinite-scroll-disabled='busy' infinite-scroll-distance='1' infinite-scroll-container="'#infi-scroll'" ng-cloak> 
    <div ng-repeat="single in projects" class="col-md-4 bottom-margin"> 
     <!-- listing goes here --> 
    </div> 
    <div ng-show='busy'> 
     <center> 
     <img src="images/ajax-loader.gif" /> 
     </center> 
    </div> 
    </div> 
</div> 

Я нашел этот код, работающий с мобильными устройствами, а также без каких-либо проблем.

Примечание: если высота для html, теги тела определены под вашим отзывчивым css, это может повлиять на работу на мобильных устройствах. (например: html, body {height: 100%! important;})

Надеюсь, что это решит вашу проблему. Благодарю.