简单的 If/Else Razor 语法答案

【问题标题】：Simple If/Else Razor Syntax简单的 If/Else Razor 语法
【发布时间】：2012-03-31 09:53:26
【问题描述】：

我正在尝试使用以下代码在 foreach 中执行一个简单的 If/Else：

@{
var count = 0;
foreach (var item in Model)
{
    if (count++ % 2 == 0)
    {
        @:<tr class="alt-row">
    } else { 
        @:<tr>
    }
        <td>
            @Html.DisplayFor(modelItem => item.Title)
        </td>
        <td>
            @Html.Truncate(item.Details, 75)
        </td>
        <td>
            <img src="@Url.Content("~/Content/Images/Projects/")@item.Images.Where(i => i.IsMain == true).Select(i => i.Name).Single()" 
                alt="@item.Images.Where(i => i.IsMain == true).Select(i => i.AltText).Single()" class="thumb" />
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ProjectId }) |
            @Html.ActionLink("Details", "Details", new { id = item.ProjectId }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ProjectId })
        </td>
    </tr>
}
}

我收到一个解析错误“遇到没有匹配的开始标签的结束标签“tr”。你的开始/结束标签是否正确平衡？”。似乎 if 语句不想工作。

【问题讨论】：

标签： c# asp.net-mvc razor html-table

【解决方案1】：

只用这个作为结束标签：

  @:</tr>

让你的 if/else 保持原样。

似乎 if 语句不想'工作。

它工作正常。您在这里使用 2 个语言空间，似乎最好不要在边界上分开打开/关闭三明治。

【讨论】：

谢谢。我尝试了@DJQuimby 的解决方案，它有点奏效，但 else 不再突出显示为蓝色，我收到此错误“代码块缺少结束“}”字符。确保所有“{”都有匹配的“}”字符" 此块中的字符，并且没有任何 "}" 字符被解释为标记。"您的解决方案虽然有效，但感谢您的两个建议。
@Henk Holterman 感谢您的回答。但在视觉工作室中，如果我按 ctrl + k + D 对齐代码，它会将其重新格式化为 @: ( 正在移动到下一行)。所以再次造成同样的错误
有解决这个 Pahul 的问题吗？

【解决方案2】：

我会选择去

<tr @(if (count++ % 2 == 0){<text>class="alt-row"</text>})>

甚至更好

<tr class="alt-row@(count++ % 2)">

这会给你像

这样的行

<tr class="alt-row0">
<tr class="alt-row1">
<tr class="alt-row0">
<tr class="alt-row1">

【讨论】：

你为什么有<text>标签？
抱歉，我找到了原因：weblogs.asp.net/scottgu/…
这太棒了！只是想添加外括号，导致 VS 表明 if 是一个“无效的表达式术语”。所以我把它们取下来了：<div class="row @if(cond){<text>...</text>}">，它起作用了。

【解决方案3】：

可能有点离题，但对于现代浏览器（IE9 和更新版本），您可以使用 css 奇/偶选择器来实现您想要的。

tr:nth-child(even) { /* your alt-row stuff */}
tr:nth-child(odd) { /* the other rows */ }

或

tr { /* all table rows */ }
tr:nth-child(even) { /* your alt-row stuff */}

【讨论】：

【解决方案4】：

要摆脱 if/else 的尴尬，您可以使用 using 块：

@{
    var count = 0;
    foreach (var item in Model)
    {
        using(Html.TableRow(new { @class = (count++ % 2 == 0) ? "alt-row" : "" }))
        {
            <td>
                @Html.DisplayFor(modelItem => item.Title)
            </td>
            <td>
                @Html.Truncate(item.Details, 75)
            </td>
            <td>
                <img src="@Url.Content("~/Content/Images/Projects/")@item.Images.Where(i => i.IsMain == true).Select(i => i.Name).Single()" 
                    alt="@item.Images.Where(i => i.IsMain == true).Select(i => i.AltText).Single()" class="thumb" />
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { id=item.ProjectId }) |
                @Html.ActionLink("Details", "Details", new { id = item.ProjectId }) |
                @Html.ActionLink("Delete", "Delete", new { id=item.ProjectId })
            </td>
        }
    }
}

使添加属性更容易的可重用元素：

//Block is take from http://www.codeducky.org/razor-trick-using-block/
public class TableRow : Block
{
    private object _htmlAttributes;
    private TagBuilder _tr;

    public TableRow(HtmlHelper htmlHelper, object htmlAttributes) : base(htmlHelper)
    {
        _htmlAttributes = htmlAttributes;
    }

    public override void BeginBlock()
    {
        _tr = new TagBuilder("tr");
        _tr.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(_htmlAttributes));
        this.HtmlHelper.ViewContext.Writer.Write(_tr.ToString(TagRenderMode.StartTag));
    }

    protected override void EndBlock()
    {
        this.HtmlHelper.ViewContext.Writer.Write(_tr.ToString(TagRenderMode.EndTag));
    }
}

使razor语法更清晰的辅助方法：

public static TableRow TableRow(this HtmlHelper self, object htmlAttributes)
{
    var tableRow = new TableRow(self, htmlAttributes);
    tableRow.BeginBlock();
    return tableRow;
}

【讨论】：