AngularJS directive for slide-down animation with lazy rendering
AngularJS directive for slide-down animation with lazy rendering In this blog post I am going to talk about a directive I created earlier that is available in my ng-slide-down Github repository. In the company I am working for we have a lot of widgets that are expanded via jQuery "slideToggle" function, thus when I make new components I have to adhere to existing style. As you have probably guessed new parts are written in Angular. Another requirement I had to satisfy is that we can have a lot of these widgets on a single and rendering them all in Angular would be wildly inefficient, so it had to only render HTML if widget was expanded. In order to use resulting directive all you need to is to add a directive ng-slide-down to your HTML element and pass a variable that is going to control it: <div ng-slide-down="slideDown"> Code So let's start writing the code ( fiddle ). Lazy rendering In the next step we are going to add an option to stop...