Toggle or Show or Hide is pretty easy with AngularJS

Here is my first and simple example on AngularJS Framework – seriously I will forget jQuery soon :)

As I just started exploring more on this AngularJS since a week – I thought I would share my experience to other front-end developers out there. Here is my first and basic example to either SHOW or HIDE or TOGGLE the content, it’s even easy with jQuery thought – but if you want to achieve the same without jQuery then this is the best example for you.

AngularJS Framework from Google
AngularJS Framework from Google

Some how I feel AngularJS is pretty easy and it is using Native JavaScript. Last week I have given an introduction on AngularJS, you can check this post in case you missed it.

Here is the code to Toggle content:

Click here to Toggle (show/hide) description
I am description for the above title, which was collapsed by default

I have just used “collapsed” as per my convenience, you can even have your own custom name or for it and make sure you have the same for ng-model too.

and here is the code to SHOW the description:

Click here to SHOW description
I am description for the above title, which was collapsed by default

Here I have used “expandme” which I am setting it as Yes/True on click of link.

and here is code to HIDE the layer or content or description:

Click here to HIDE description
I am description for the above title, which was collapsed by default

I hope even this is pretty explanatory.

You can check the preview in JSFiddle at:

Hope this helped you – let me know if you are looking for any tips or tricks in AngularJS, I will try to address the same.

And look forward for more examples on AngularJS – Will keep you updated with simple tricks!

Published by Sravan Kumar Kandagatla

Sravan is the Founder of WittySparks, a global content publishing platform that offers witty stories and information across multiple industry domains. Under his leadership, WittySparks today has become a go-to destination for in-depth knowledge of healthcare, business, and marketing topics. Besides, Sravan is a highly experienced web designer, developer, and user experience designer. You can connect with him on Twitter or LinkedIn and initiate a chat.

Join the Conversation


  1. Can you tell me how you created the facebook like popup in your website???? When I opened your page I saw the popup where you have only a like button?

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Share via
Send this to a friend