Question

我需要做一个“占位符”，其中foreach循环迭代不会在网格系统中填充一行。

每行有3列的空间。如果循环中只有1次迭代，请使用例如来创建2个空列。背景图像。

如果循环中只有2次迭代，请使用例如来创建1个空列。背景图像。

如果每行有3、6、9、12等，则不要使用占位符。

我正在寻找一种更动态的方式来制作这些逻辑（以及更简洁的代码）。

var loop = GetLoop("ItemPublisher:Items.List");
int totalItems = loop.Count;

int remainders = totalItems % 3;
int placeholders = 3 - remainders;
string renderPlaceholders = placeholders == 3 ? "0" : placeholders.ToString();
int index = 0;

@foreach(var i in loop){
    var title = i.GetString("ItemPublisher:Item.Title");
    var imagepath = !string.IsNullOrEmpty(i.GetString("ItemPublisher:Item.Image.ImagePath")) ? i.GetString("ItemPublisher:Item.Image.ImagePath") : "/Files/Images/placeholder.jpg";
    <div class="grid__col-md-4">
            <h4>@title</h4>
            <img src="/Admin/Public/GetImage.ashx?width=992&height=560&crop=0&Compression=75&image=@imagepath"/>
    </div>
}

@*Render placeholders*@  
@if(placeholders == 1)
{
    var imagepath = "/Files/Images/placeholder.jpg";
    <div class="grid__col-md-4 placeholder">
        <h4></h4>
        <img src="/Admin/Public/GetImage.ashx?width=992&height=560&crop=0&Compression=75&image=@imagepath"/>
    </div>
}
else if(placeholders == 2)
{
    var imagepath = "/Files/Images/placeholder.jpg";
    <div class="grid__col-md-4 placeholder">
        <h4></h4>
        <img src="/Admin/Public/GetImage.ashx?width=992&height=560&crop=0&Compression=75&image=@imagepath"/>
    </div>

    <div class="grid__col-md-4 placeholder">
        <h4></h4>
        <img src="/Admin/Public/GetImage.ashx?width=992&height=560&crop=0&Compression=75&image=@imagepath"/>
    </div>

  }

使占位符循环

0 个答案: