Create a grid layout using ng-repeat

The situation I'm trying to solve is this, and I'm a little puzzled by how this can be resolved. I use ng-repeatfor each of the points that I have indicated here, and I intend to use this in the final solution, if possible.

  • I have an array of objects, all the same format. (Consider it true)
  • Each object has a list of attributes.
  • I want to arrange them in a grid s> 2 columns and there will be an arbitrarily large number of rows.
  • Each grid location will display the attributes of the object at that location.
  • The number of columns does not have to be dynamically changed.

The requirement "> 2 columns" is that I understand how to make one or two layouts of the table (one column is an unordered and unset list and two columns using ng-evenor ng-oddand using css to create a new line).

So, the question is basically this: for an array of size Nand column number of size M( M<N), can I create a grid of elements Nusing the Melements in the row when used ng-repeat?

If possible, I would prefer not just to insert <br>each element M- since I use ng-repeat, each element should have attributes of the object, as I define it in ng-repeat, and I know that angular will deal with incorrect input, but using it does not seem to be correct practice.

Also, using the table leaves me in the same situation as before, I still need to perform different operations with each element M.

Is there a clean way to do this in angular?

It is worth noting that I also use twitter-bootstrap, so I will also welcome css solutions.

Thanks in advance and please tell me if I miss something obvious.

+5
source share
2 answers
+7

, , . , 2D- ng-repeat col-md-6 a row.

0

All Articles