Table Sorting–angularjs

   1:  <scripttype= "Text/javascript"ng:autobind

   2:  src= "Http://code.angularjs.org/0.10.5/angular-0.10.5.js"> </script>

   3:  

   4:  <tableng:controller= "Sortabletablectrl"  >

   5:      <thead>

   6:          <tr>

   7:              <thng:repeat= "(i,th) in head"ng: Class= "Selectedcls (i)"ng:click= "changesorting (i)">{{th}} </ th >

   8:          </tr>

   9:      </thead>

  Ten:      <tbody>

One   :          <trng:repeat= "row in body. $orderBy ( Sort.column, sort.descending) ">

  :              <td>{{row.a}}</TD  >

  :              <td>{{row.b}}</TD  >

  :              <td>{{row.c}}</td> 

  :          </tr>

  :      </tbody>

  :  </table>

Javascript

   1:  function Sortabletablectrl () {

   2:      varthis;

   3:  

   4:      //Data

   5:      scope.head = {

   6:          "Name",

   7:          "Surname",

   8:          "City"

   9:      };

  Ten:      scope.body = [{

One   :          "Hans",

  :          "Mueller",

  :          "Leipzig"

  :      }, {

  :          "Dieter",

  :          "Zumpe",

Page   :          "Berlin"

  :      }, {

  :          "Bernd",

  :          "Danau",

  :          "Muenchen"

  :      }];

  23:      

  :      scope.sort = {

  :          ' B ',

  :          false

  :      };

  :  

  :      function(column) {

  :          return' sort-' + scope.sort.descending;

  :      };

  32:      

  :      function(column) {

  :          var sort = Scope.sort;

  :          if (sort.column = = column) {

  £ º              sort.descending =!sort.descending;

  PNS:          else {

  £              sort.column = column;

  :              false;

Max   :          }

  :      };

£ º}
Css
   1:  td {Padding:0.2em 1em;}
   2:  th {text-align:center;}
   3:  thead {
   4:      
   5:      cursor:pointer;  
   6:  }
   7:  
   8:  /* http://www.greywyvern.com/code/php/binary2base64 * /
   9:  
  Ten:  . sort-true {
One :Background:no-repeat Right Center URL (data:image/gif;base64,r0lgodlhcgakalmaahfxcykcgp2dnaampq+vr83nzehh4fwaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaach5bakaaagaif/ 8sundukdcrzewmtiaaauwyxbwbaigaabtbnryukdcifhzwiah2qacabkacwaaaathy3nwqvbqtaaaaabhchbsaaaaaaaaaaaaaaaaaaaaaaaa9tyaaqaaaadt lwfwcgwaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaatkc2ntaaabcaaaavjkzxnjaaad/ Aaaag9nwflaaaaebaaaabr3dhb0aaaegaaaabrywflaaaaelaaaabriwflaaaaeqaaaabryvfjdaaaevaaaaa5jchj0aaaezaaaadhjagfkaaafbaaaacxn /1rsqwaablwaaaaoylrsqwaablwaaaaobwx1ywaaaaaaaaaraaaadgvuvvmaaaamaaacfmvzrvmaaaamaaabgmrhresaaaauaaab6mrlreuaaaasaaabqgzpr Kkaaaaoaaaa3gzyrluaaaaoaaabkml0svqaaaaoaaacvm5stkwaaaaoaaacgg5itk8aaaamaaabbhb0qliaaaamaaabgnn2u0uaaaamaaabbgphslaaaaaaaa Abumtvs1iaaaawaaacqhpovfcaaaawaaabbhpoq04aaaawaaab1hj1uluaaaaiaaacphbsuewaaaasaaacxgbzagwazqbpag4azf8abgagafiarwbcac0acab Yag8azgbpagkababpaecazqbuaguacgbpahmaawagafiarwbcac0acabyag8azgbpagwauabyag8azgbpagwaiabhaokabgdpahiaaqbxahuazqagafiavgbc tgcclaagafiarwbcacaw1zdtmnuwotckmouqgnuoacaaugbhaeiaiijyx2ljz4/ Wafaazqbyagyaaqbsacaaugbhaeiaiabhaguabgdpahiaaqbjag8aqqbsagwazwblag0azqbpag4azqbzacaaugbhaeialqbqahiabwbmagkabgzukboaiabsaecaqgagy8+p8gx/ H072aecazqbuaguacgblagwaiabsaecaqgatagiazqbzagsacgbpahyazqbsahmazqbbagwazwblag0azqblag4aiabsaecaqgatahaacgbvagyaaqblagzhf Lwyacaaugbhaeiainueufztdmd8afaacgbvagyaaqbsag8aiabsaecaqgagaecazqbuaguacgbpagmabwbhaguabgblahiaaqbjacaaugbhaeiaiabqahiabw bmagkabablbb4emqrjbdgeoqagbd8eqaq+beqeoaq7bewaiabsaecaqgbvag4aaqb3aguacgbzageababuahkaiabwahiabwbm/ Wbpagwaiabsaecaqgaazgvzywaaaaaaaaaur2vuzxjpyybsr0iguhjvzmlszqaaaaaaaaaaaaaafedlbmvyawmgukdcifbyb2zpbguaaaaaaaaaaaaaaaaaaa Aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaafhzwiaaaaaaaabadqaarhmaabc0wflaiaaaaaaaapnsaaeaaaabfs9ywvogaaaaaaaade0aad3 Uaaad0fhzwiaaaaaaaaaoggaafz8aalg2y3vydgaaaaaaaaabac0aahrlehqaaaaaq29wexjpz2h0idiwmdcgqxbwbgugsw5jlkmsigfsbcbyawdodhmgcmvz zxj2zwquahnmmziaaaaaaaemqgaabd7///mmaaahkgaa/zh///ui/// 9OWAAA9WAAMBSACWAAAAACGAKAAAEJZAMICAKQZJNTYHFXWEIIROFAOOKUNAPU26T+6KFLYE1TGQ5VWQAOW%3D%3D);
  :  }
  :  . sort-false {
:Background:no-repeat Right Center URL (data:image/gif;base64,r0lgodlhcgakalmaahfxcykcgp2dnaampq+vr83nzehh4fwaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaach5bakaaagaif/ 8sundukdcrzewmtiaaauwyxbwbaigaabtbnryukdcifhzwiah2qacabkacwaaaathy3nwqvbqtaaaaabhchbsaaaaaaaaaaaaaaaaaaaaaaaa9tyaaqaaaadt lwfwcgwaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaatkc2ntaaabcaaaavjkzxnjaaad/ Aaaag9nwflaaaaebaaaabr3dhb0aaaegaaaabrywflaaaaelaaaabriwflaaaaeqaaaabryvfjdaaaevaaaaa5jchj0aaaezaaaadhjagfkaaafbaaaacxn /1rsqwaablwaaaaoylrsqwaablwaaaaobwx1ywaaaaaaaaaraaaadgvuvvmaaaamaaacfmvzrvmaaaamaaabgmrhresaaaauaaab6mrlreuaaaasaaabqgzpr Kkaaaaoaaaa3gzyrluaaaaoaaabkml0svqaaaaoaaacvm5stkwaaaaoaaacgg5itk8aaaamaaabbhb0qliaaaamaaabgnn2u0uaaaamaaabbgphslaaaaaaaa Abumtvs1iaaaawaaacqhpovfcaaaawaaabbhpoq04aaaawaaab1hj1uluaaaaiaaacphbsuewaaaasaaacxgbzagwazqbpag4azf8abgagafiarwbcac0acab Yag8azgbpagkababpaecazqbuaguacgbpahmaawagafiarwbcac0acabyag8azgbpagwauabyag8azgbpagwaiabhaokabgdpahiaaqbxahuazqagafiavgbc tgcclaagafiarwbcacaw1zdtmnuwotckmouqgnuoacaaugbhaeiaiijyx2ljz4/ Wafaazqbyagyaaqbsacaaugbhaeiaiabhaguabgdpahiaaqbjag8aqqbsagwazwblag0azqbpag4azqbzacaaugbhaeialqbqahiabwbmagkabgzukboaiabsaecaqgagy8+p8gx/ H072aecazqbuaguacgblagwaiabsaecaqgatagiazqbzagsacgbpahyazqbsahmazqbbagwazwblag0azqblag4aiabsaecaqgatahaacgbvagyaaqblagzhf Lwyacaaugbhaeiainueufztdmd8afaacgbvagyaaqbsag8aiabsaecaqgagaecazqbuaguacgbpagmabwbhaguabgblahiaaqbjacaaugbhaeiaiabqahiabw bmagkabablbb4emqrjbdgeoqagbd8eqaq+beqeoaq7bewaiabsaecaqgbvag4aaqb3aguacgbzageababuahkaiabwahiabwbm/ Wbpagwaiabsaecaqgaazgvzywaaaaaaaaaur2vuzxjpyybsr0iguhjvzmlszqaaaaaaaaaaaaaafedlbmvyawmgukdcifbyb2zpbguaaaaaaaaaaaaaaaaaaa Aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaafhzwiaaaaaaaabadqaarhmaabc0wflaiaaaaaaaapnsaaeaaaabfs9ywvogaaaaaaaade0aad3 Uaaad0fhzwiaaaaaaaaaoggaafz8aalg2y3vydgaaaaaaaaabac0aahrlehqaaaaaq29wexjpz2h0idiwmdcgqxbwbgugsw5jlkmsigfsbcbyawdodhmgcmvz zxj2zwquahnmmziaaaaaaaemqgaabd7///mmaaahkgaa/zh///ui/// 9OWAAA9WAAMBSACWAAAAACGAKAAAEJRBJREKZSXQDSCSGIVZZFNYTGIQKTP7FG46UZAN2TAYCMPC9QAQAOW%3D%3D);
  :  }
source:http://jsfiddle.net/vojtajina/js64b/14/

Table Sorting–angularjs