Using Angular + JQuery for a Pinterest-Style Dynamic Layout

[rocketjot]

Hi all.  Long time listener, first time caller.

I'm relatively new to Angular and have very little experience with JQuery, so whatever insight/advice you can give me would be greatly appreciated.

My goal is to build a dynamic Pinterest-style layout that filters on the fly as users type in their query. I've managed to hack together something moderately functional here:

http://plnkr.co/IW9FBA3KO0uYfl8WNCno

[Note: this is based on the excellent work done by Ben Holland here ( http://benholland.me/javascript/how-to-build-a-site-that-works-like-pinterest/ )]

I essentially have two questions about the marriage of Angular & JQuery:

1. I have most of the app logic running in the controller, but I'm guessing a better way to achieve this would be via a directive?

2. Is there a cleaner/easier/simpler way to do this without using Jquery and just using Angular's new animation features?

Thanks again for any guidance you can offer.

[johntom]

Check out the masonry example which is also pretty cool.

http://jsfiddle.net/pjstarifa/uj98n/2/

John

[rocketjot]

I have read that Masonry does not play well with Angular -- specifically with ng-repeat, which is what I rely on heavily.

I'd also like to try to move away from JQuery toward a cleaner/simpler solution (like pure Angular) if possible.

But thanks for the heads up.