Column and Row Based Tables in AngularJS

Row based dynamic tables are fairly easy. However, AngularJS makes building a column based dynamic table just as easy. The full code is also on JSFiddle

Screen Shot 2013-06-13 at 2.19.19 PM

The HTML relies on several Angular tags to build the tables.

The actual JavaScript is very short (outside of the data initialization which would come from a service in a real app). The controller adds a click function that was defined in the HTML above in the <input> tag. The rest of the Javascript sets up the data and labels for the app.

 

Share and Enjoy

  • Facebook
  • Twitter
  • Delicious
  • LinkedIn
  • StumbleUpon
  • Add to favorites
  • Email
  • RSS

Comments on this entry are closed.

  • Jonathan Miranda

    Without last line and runing up again on jsfiddle it’s works, what is the purpose of the $inject in the example?

    • tjsnell

      I was a week or so into learning AngularJS and was confused about some of the mechanics. I’ve removed that line. Thanks!

  • Priit Hansen

    Thank You man! I was going crazy with transposing arrays in php.

  • Anand S

    In this Expample of dynamic header , how can i make tbody scollable and fixed header?