C# Razor c中基于代码的中继器#

我有以下代码：

@foreach (var row in Model)
        {
           <div><img src="~/Content/images/flickabase/@row.FlickaMasterImage" alt="@row.FlickaMasterImageCaption" class="img-thumbnail" width="100" heigh="100"/>
            <a href="/flickas/flickaid/@row.Id/flickaname/@row.FlickaName.Trim()">@row.FlickaName</a> </div> 
        }

@foreach（模型中的变量行）
{
}

这将打印出一系列缩略图和船名。像这样

问题是我想写出四列，数据从上到下、从左到右运行。 使用.net中继器控件以前很容易做到这一点，但我不知道如何使用Razor轻松做到这一点。有没有一个简单的方法可以做到这一点？我想到的最好的办法是数一数行。除以四，然后（因为我使用的是引导）为每个批创建一个网格列

---

Norb.

正如您已经发现的，razor中没有现成的解决方案。@B.Yaylaci已经建议，Bootstrap是解决此问题的最佳解决方案。……请参考以下问题：

---

希望有帮助，干杯。

谢谢你的评论

最后我就是这样解决的。我使用Skip和Take对模型进行处理，以获得批量数据。永远不会有大量的数据，当数据增长时，我将在将来再次访问。我最终放弃了这些图片。这四个批次在一个引导列中一个接一个地写出，引导列进行布局

我相信有一种更优雅的方式，但现在就可以了

@{
    Layout = "Shared/_Layout.cshtml";
    ViewBag.Title = "Flicka Names";
    var i = Model.Count(); // count rows
    var size = i/4; // get the batch size

    var first = Model.Take(size);
    var second = Model.Skip(size).Take(size); 
    var third = Model.Skip(size * 2).Take(size);
    var fourth = Model.Skip(size * 3).Take(size);
}

<h1>Flicka Names</h1>
<p>There are @i Flickas in our system.</p>

<div class="col-sm-3">

    @foreach (var row in first)
        {
           <div>
            <a href="/flickas/flickaid/@row.Id/flickaname/@row.FlickaName.Trim()">@row.FlickaName</a> </div>

        }
    </div>

<div class="col-sm-3">
    @foreach (var row in second)
        {
        <div>
            <a href="/flickas/flickaid/@row.Id/flickaname/@row.FlickaName.Trim()">@row.FlickaName</a></div>

        }
</div>


<div class="col-sm-3">
    @foreach (var row in third)
        {
        <div>
            <a href="/flickas/flickaid/@row.Id/flickaname/@row.FlickaName.Trim()">@row.FlickaName</a>
        </div>

    }

</div>

<div class="col-sm-3">
    @foreach (var row in fourth)
            {
        <div>
            <a href="/flickas/flickaid/@row.Id/flickaname/@row.FlickaName.Trim()">@row.FlickaName</a>
        </div>

    }

@{
Layout=“Shared/_Layout.cshtml”；
ViewBag.Title=“Flicka名称”；
var i=Model.Count（）；//计算行数
var size=i/4；//获取批大小
var first=模型。取值（大小）；
var second=Model.Skip（大小）、Take（大小）；
第三个变量=Model.Skip（大小*2）。Take（大小）；
第四个变量=模型。跳过（大小*3）。获取（大小）；
}
弗利卡名字
我们的系统中有@i Flickas

@foreach（第一个变量行）
{
}
@foreach（第二行的变量）
{
}
@foreach（第三行中的var行）
{
}
@foreach（第四行的var）
{
}

---

尝试用CSS处理它，否则必须编写一些笨拙的逻辑。您可以用CSS完成这项工作，获取bootsrap并导入到您的解决方案中，并将其作为指南。还有这个,；（有JSFIDLE演示和源代码）