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 for a week – I thought I would share my experience with 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.
Somehow I feel AngularJS is pretty easy and it is using Native JavaScript. Last week I have given an introduction to 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 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
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 hope even this is pretty explanatory.
You can check the preview in JSFiddle at: http://jsfiddle.net/sravkum/EhTZW/
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 to more examples on AngularJS – Will keep you updated with simple tricks!
Article by