Wait for images in ng-repeat to render in view

I have a chat app where I’m using ng-repeat to display messages. When the view renders I immediately scroll to the bottom to start at the most recent message. The problem is that some messages have images and the time it takes for the images to render on the view varies so sometimes the scrollBottom thinks its at the bottom, then the images finish rendering and you’re only halfway down. I’m even caching the images with angular image cache but the split second it still takes to display in the view causes the issue. Right now I’m just setting a timeout and then scrolling, but this doesn’t work all the time since the it varies. Any ideas?

1 Like