2

我正在为我的项目使用 asp.net MVC 4，并且我有一个模型。我正在使用 Bootstrap Carousel 为我的索引页面显示产品（见下图）

现在我的问题是：我想在每个幻灯片项目中显示 3 个产品。我应该为此编写一个 ViewModel 吗？

<div class="carousel slide>
  @for (int i = 0; i <= Model.Count()/3; i++ ) <!-- this works well, paging -->
    {
      <div class="item @if(i==0){<text>active</text>}">
        @foreach(var well in Model)
        {
            <div class="span4">
                <!-- some html here -->
            </div>
        }
      </div>
    }
</div>

旋转木马

4

2 回答 2

9

您的内部foreach正在迭代整个Model集合 - 您需要将其限制为仅相关的三个项目。

我猜你想要类似的东西：

<div class="carousel slide>
    @for (int i = 0; i <= Model.Count()/3; i++ ) <!-- this works well, paging -->
    {
        <div class="item @if(i==0){<text>active</text>}">
        @foreach(var well in Model.Skip(i*3).Take(3))
        {
            <div class="span4">
                <!-- some html here -->
            </div>
        }
        </div>
    }
</div>
于 2013-03-13T01:42:15.090 回答
2

考虑这个问题的一种方法是将原始集合拆分为每 3 个连续元素的组。幸运的是，您可以使用GroupBy“元素索引除以 3”作为键的 LINQ 方法。Skip(x * 3).Take(3)IMO，此解决方案的优点是它比在内部循环中重复集合更清楚地表达了您的意图并且具有更好的性能。

<div class="carousel slide>
    @foreach (var group in Model.Select((x, index) => new { element = x, index }).GroupBy(x => x.index / 3, x => x.element))
    {
        <div class="item @if( group.Key == 0) {<text>active</text>}">
        @foreach(var well in group)
        {
            <div class="span4">
                <!-- some html here -->
            </div>
        }
        </div>
    }
</div>

我什至会将模型类型更改为ILookup<int, TElement>并在控制器中执行分组。

于 2013-03-14T09:41:51.633 回答