使用 ng-重复创建"grid"布局



我想解决的情况是这样的,我有点困惑,如何才能解决这个问题。我在这里陈述的每一点都使用ng-repeat,如果可能的话,我打算在最终解决方案中使用它。

  • 我有一个对象数组,所有的格式完全相同。(安全地假设这是真的)
  • 每个对象都有一个属性列表。
  • 我希望在一个有>2列的网格中安排这些,并且会有任意大量的行。
  • 每个网格位置将显示该位置对象的属性。
  • 列数不需要动态更改。

>2列的要求是,我知道如何做一个或两个列的网格布局(一列是一个无序和无样式的列表和两个列使用ng-evenng-odd和使用css创建一个新的行)。

所以问题基本上是这样的:对于大小为N的数组和大小为M (M<N)的列号,我可以创建N元素的网格,每行有M元素,同时仍然使用ng-repeat吗?

如果可能的话,我宁愿不只是插入<br>每个M元素-因为我使用ng-repeat每个元素预计具有对象的属性,因为我在ng-repeat中定义它,我知道角将处理不正确的输入,但利用这似乎不像正确的做法。

同样使用表使我处于与以前相同的情况,我仍然需要对每个M元素执行不同的操作。

在angular中是否有一种干净的方法来做到这一点?

值得注意的是,我也在使用twitter-bootstrap,所以我也欢迎css解决方案。

提前感谢,如果我遗漏了什么,请告诉我。

我真的不知道这是否是你正在寻找的(如果不是请提供一个例子- json数据数组也很好!)

这是一个显示MxN数据(数组)的plunk !如果你愿意,你也可以把它变成object)

http://plnkr.co/edit/TgKA0cQ80Vo3vWztxFw4?p =预览

我也有同样的问题,不幸的是,表不会为我的用例做的技巧。似乎即使在二维数组中,ng-repeat也倾向于忽略col-md-6,即使在row中也是如此。

最新更新