Question

我想要做的是，有一个div包含图标集，但我想要每行有5个图标。所以我写了这样的东西。

<div id="icons-list1" class="icons-list">
    @{ int catCount = 0; }
    @foreach (var catItem in Model.Categories)
    {
        if (catCount == 0)
        {
           <div class="icons-list-row">
        }
        <label title="@catItem.Name" data-selected-color="#@catItem.ColorCode" data-position="n" class="icon static big tooltip" original-title="Tooltip Title">
            <img alt="@catItem.Name" src="@Url.Content(@BonubonUrlHelper.CategoryImages + "dark/music.png")">
            <input name="categories" value="@catItem.Id" type="checkbox" />
        </label>
        catCount++;
        @if (catCount == 5)
        {
            </div>
            catCount = 0;  
        }
    }
</div>

但我得到一个错误，说foreach声明没有结束块。我尝试了一切，但我无法让它发挥作用。我做错了什么？我是razor语法的新手。

由于

Answer 1

确保在出现此类问题时转义html语句。

但是，在您的情况下，实际问题是在第二个@语句之前使用if转义字符，这是不需要的：

<div id="icons-list1" class="icons-list">
    @{ int catCount = 0; }
    @foreach (var catItem in Model.Categories)
    {
        if (catCount == 0)
        {
           @:<div class="icons-list-row">
        }
        <label title="@catItem.Name" data-selected-color="#@catItem.ColorCode" data-position="n" class="icon static big tooltip" original-title="Tooltip Title">
            <img alt="@catItem.Name" src="@Url.Content(@BonubonUrlHelper.CategoryImages + "dark/music.png")">
            <input name="categories" value="@catItem.Id" type="checkbox" />
        </label>
        catCount++;
        if (catCount == 5)
        {
            @:</div>
            catCount = 0;  
        }
    }
</div>

Answer 2

问题是，您已经转义了行中的if

@if (catCount == 5)

当您使用@foreach {之类的内容编写一行代码时，您就不再需要转义C＃代码了。

只需删除@前面的if，错误就会消失。

Razor语法内联代码

2 个答案: