title: How to display single column data in tabular format with angularjs?
body: <p>My REST API returns hundreds rows of data that looks something like this:</p>
  
  <pre><code>[
   {"roman_number":"I"},
   {"roman_number":"II"},
   {"roman_number":"III"},
   {"roman_number":"IV"}
   {"roman_number":"V"},
   {"roman_number":"VI"},
   {"roman_number":"VII"},
   {"roman_number":"VII"},
  ...
   {"roman_number":"MMI"}
  ]
  </code></pre>
  
  <p>I'd like to be able to display the data in table like so ...</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table border=1&gt;
    &lt;tr&gt;&lt;td&gt;I&lt;/td&gt;&lt;td&gt;II&lt;/td&gt;&lt;td&gt;III&lt;/td&gt;&lt;td&gt;IV&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;V&lt;/td&gt;&lt;td&gt;VI&lt;/td&gt;&lt;td&gt;VII&lt;/td&gt;&lt;td&gt;VIII&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;IX&lt;/td&gt;&lt;td&gt;X&lt;/td&gt;&lt;td&gt;XI&lt;/td&gt;&lt;td&gt;XII&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;XIII&lt;/td&gt;&lt;td&gt;XIX&lt;/td&gt;&lt;td&gt;XX&lt;/td&gt;&lt;td&gt;XXI&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td colspan=4&gt; pagination here &lt;/td&gt;&lt;/tr&gt;
   &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I hope that I do this in angular as I am using angular HTTP to communicate with my REST API.  Thanks.</p>
  
  <p>Updated based on Partha Sarathi Ghosh suggestion.</p>
  
  <p>I have this app file:</p>
  
  <pre><code>var app = angular.module("myApp", ['smart-table']);
  
  angular.module('myApp').filter('chunkby', function() {
    return function(input, chunk) {
      var i,j,temparray=[];
      if(! input ) { return; }
      for (i=0,j=input.length; i&lt;j; i+=chunk) {
        temparray.push(input.slice(i,i+chunk));
      }
      return temparray;
    };
  });
  </code></pre>
  
  <p>... and I have this html ...</p>
  
  <pre><code> &lt;table&gt;
   &lt;tr ng-repeat="row in (all_types|chunkby:5)"&gt;
   &lt;td ng-repeat="col in row"&gt;{{col}}&lt;/td&gt;
   &lt;/tr&gt;
   &lt;/table&gt;
  </code></pre>
  
  <p>... but I get this error in my console ...</p>
  
  <pre><code>Error: [$rootScope:infdig] ...
  </code></pre>
  
  <p>... but the data displays ok.  I noticed that the plunker demo also gets this error too.</p>