Tuesday, April 8, 2014

AngularJS show hide html elements

AngularJS is becoming more popular in web application development day by day. And it is not as simple as jQuery. Its main focus is not DOM manipulation, but it's more in Data manipulation, and is more logical. It teaches all jQuery developers a more sophisticated way of coding where the developers understand the next level of OOP.

I miss jQuery a lot. Especially, the handy methods like show() hide(). If we want to get the same effect with AngularJS, we have to put some logic in controllers and implement it with ng-click, ng-class, ng-show, ng-hide. In this post I will write some simple and easy to understand examples for this most needed ng-hide and ng-show methods .

Show Hide DIV on Click: Demo

Toggle DIV : Demo 

Toggle DIV with Animations: Demo

Related Articles:
AngularJS Add Class and Toggle Class
AngularJS Toggle Class with Animation