ui-scroll does not work (v. 0.1.0) - virtual scrolling

[codepreneur]

I have described the issue here:

http://stackoverflow.com/questions/20873894/angular-ui-ui-utils-ui-scroll-does-not-work-v-0-1-0

-V

[rickhuizinga]

Same problem.

[rickhuizinga]

This problem happened to me when the ng-scroll directive was inside of a ng-switch block. The result is that the height of each item is calculated to be zero.

[mfeingold]

Can you give me a little more details? If I understand the stackoverflow issue correctly it is about forcing the scrollbar on the viewport event though there is no items - well, this can be done with proper styling. Are having the same problem?

[rickhuizinga]

The problem is that when the scroll item height is calculated to be zero, the following problems occur:

1. ng-scroll attempts to fetch all scrollable items. I.e. if the height is zero, it can fit them all.
2. Even though all items have been fetched, the scroll list DOM contains zero items, exactly as shown in the stackoverflow.

In my case, I had a valid datastore with around 100 elements. My ng-scroll-viewport and ng-scroll directives were within an ng-switch directive. This caused a problem during page load, when the ng-scroll directive attempts to determine the calculated height of the scroll items: the ng-scroll directive forced them to be non-visible with a resulting height of zero.

If I moved the ng-scroll outside of the ng-switch, it works properly.

[rickhuizinga]

The same problem applies when ng-scroll is inside an ng-if block or within an Angular Bootstrap accordian.

It works fine when using ng-show.

Could this be a directive priority issue?

[mfeingold]

Hmm... It looks like a problem with height calculation of invisible (disabled) items. Can you throw together a quick repro? I will have a look

[rickhuizinga]

@mfeingold Here is a Plunker with a reproduction of the error:

http://plnkr.co/edit/QmugOwohDmG1ojXBea1E

The instance of ng-scroll inside the tabset is not visible because the directive adds no elements to the DOM, despite fetching all items from the datasource. It is a result of the zero height problem

[mfeingold]

Thank you for the repro.
A quick look at what's going on makes me think that the problem is that instead of operating on the html in the page, scroller messes with the html inside of the tab template which does not have a parent because it is pulled out of the page by the tab directive.
To fix it I will have to dig a little deeper.

[mfeingold]

Just patched it up. Please have a look and close the issue if you feel so.

[rickhuizinga]

Yes, that fixed it. Thanks!

It looks like I don't have permissions to close this issue, as I'm not the original poster.