AngularJS: Scroll to end of element after applying DOM changes

Question

I have a simple list of items. I want to be able to scroll to the bottom of the element displaying the items whenever I add more items. I understood there is no way of hooking to the end of the $apply() function, so what might be my solution?

Here is a jsfiddle to illustrate my problem. after adding enough items, the ul element doesn't scroll to the bottom...

Answer 1

There's the very awesome angularjs-scroll-glue available, which does exactly what you want.

All you need to do is to apply the scroll-glue directive to your container element, and you get exactly what you're looking for.

There's also a demo available.