获取razor foreach的索引值

Question

我List<T>在我的视图中在一个剃刀foreach循环中迭代一个部分.在部分我正在渲染一个我希望在我的视图中连续4行的记录.我有两个结束列的css类,因此需要在部分中确定调用是第一个还是第四个记录.在我的部分中输出正确代码的最佳方法是什么？

这是我的主页面,其中包含循环:

@foreach (var myItem in Model.Members){

        //if i = 1
        <div class="grid_20">
        <!-- Start Row -->

        //is there someway to get in for i = 1 to 4 and pass to partial?
        @Html.Partial("nameOfPartial", Model)

        //if i = 4 then output below and reset i to 1
        <div class="clear"></div>
        <!-- End Row -->
        </div>

}

我想我可以创建一个int,我可以在每次传递时更新并在这里渲染文本没有问题,但它将整数值传递给我更偏心的部分.除非有更好的方法.

这是我的部分:

@{
switch()
case 1:
        <text>
        <div class="grid_4 alpha">
        </text>
break;
case 4:
        <text>
        <div class="grid_4 omega">
        </text>
break;
default:
        <text>
        <div class="grid_4">
        </text>
break;
}

        <img src="Content/960-grid/spacer.gif" style="width:130px; height:160px; background-color:#fff; border:10px solid #d3d3d3;" />
        <p><a href="member-card.html">@Model.Name</a><br/>
        @Model.Job<br/>
        @Model.Location</p>
</div>

不确定我今天是否有一个金发碧眼的日子,这很容易,但我想不出最好的方法来传递int值.希望有人可以提供帮助.

Answer 1

 @{int i = 0;}
 @foreach(var myItem in Model.Members)
 {
     <span>@i</span>
     @{i++;
      }
 }

Answer 2

//this gets you both the item (myItem.value) and its index (myItem.i)
@foreach (var myItem in Model.Members.Select((value,i) => new {i, value}))
{
    <li>The index is @myItem.i and a value is @myItem.value.Name</li>
}

更多信息,请访问我的博客 http://jimfrenette.com/2012/11/razor-foreach-loop-with-index/

Answer 3

使用Linq查看此解决方案.他的例子类似,因为他需要为每第3个项目提供不同的标记.

foreach( var myItem in Model.Members.Select(x,i) => new {Member = x, Index = i){
    ...
}

Answer 4

或者你可以简单地这样做:

@foreach(var myItem in Model.Members)
{    
    <span>@Model.Members.IndexOf(myItem)</span>
}

Answer 5

您还可以使用解构和元组并尝试如下操作：

@foreach (var (index, member) in @Model.Members.Select((member, i) => (i, member)))
{
  <div>@index - @member.anyProperty</div>

  if(index > 0 && index % 4 == 0) { // display clear div every 4 elements
      @: <div class="clear"></div>
  }
}

欲了解更多信息，您可以查看此链接