sroze / ngInfiniteScroll

Infinite Scrolling for AngularJS
http://sroze.github.com/ngInfiniteScroll/
MIT License
2.89k stars 723 forks source link

Hidden container #214

Open Jurigag opened 9 years ago

Jurigag commented 9 years ago

There are some problems with hidden containers - its getting wrong dimensions when its hidden and trigger load function when it shouldnt be, maybe you could add some if to check if container is visible first and then go working ?

Im using it with notifications - on hover/click like on facebook.

AmmarL commented 9 years ago

I am having same issue. Did you manage to solve it? @Jurigag

Jurigag commented 9 years ago

I added those directives : infinite-scroll-use-document-bottom="false" infinite-scroll-distance='1' infinite-scroll-parent and it works fine. My parent is li element..

guilhermecvmnsj commented 8 years ago

@Jurigag could you provide samples? Did not work for me

Jurigag commented 8 years ago

My html template looks like this:

<li class="external">
    <h3>Nieprzeczytanych powiadomień: <span class="bold" ng-bind="unread"></span></h3>
</li>
<li style="max-height: 250px; overflow-y: scroll;">
    <ul class="dropdown-menu-list" infinite-scroll='loadMore()' infinite-scroll-disabled='busy || all' infinite-scroll-use-document-bottom="false" infinite-scroll-distance='1' infinite-scroll-parent id="infinite-container">
        <li ng-repeat="notification in notifications track by notification.id" ng-class="[notification.readStatus == 0 ? 'un-active' :'']">
            <div class="single-notification">
                <span class="time" am-time-ago="notification.addDate | amParse:'YYYY-MM-DD HH:mm:ss'"></span>
                <span tooltip="Oznacz jako przeczytane" ng-click="markAsRead(notification)" class="timeread pointer"><i class="fa fa-eye"></i></span>
                <a href="{{::generateUrl(notification)}}">
                    <span class="details">
                    <span class="label label-sm label-icon label-success">
                        <i class="fa fa-plus"></i>
                    </span>
                    <span compile="notification.content"></span>
                    </span>
                </a>
            </div>
        </li>
    </ul>
</li>

Code of it is just included in ul tag which is display:none by default.

guilhermecvmnsj commented 8 years ago

@Jurigag thanks