javascript - 在 ASP.NET MVC C# 中将 if 和 else 放入 Foreach 循环中

Question

当我在 foreach 循环中编写 if 和 else 语句时，遇到了错误。我不确定出了什么问题。我什至在代码中添加了 @if 和 @var{ }; 。但还是有错误。

Answer 1

将部分 html 片段与条件 C#/Razor 代码混合并不是一个好主意。代码可能会重复，但以后更容易阅读和维护。

我可能没有正确捕获您的意图，但我可以阅读此内容并了解条件如何影响输出。

@foreach (var item in Model)
{
    var HeaderImage = item.HeaderPath;

    if (image != "")
    {
        var fileSavePath = Path.Combine(@"\\mainPage.com", "");
        <div class="picGallery">
            <img src="@Url.Content(item.HeaderPath)" alt="Image" />

            <a href="@Url.Action("ViewPage", "Home")">
            </a>
            <div class="desc2">
                <p style="font-size: 13;">@item.Text</p>
                <p style="font-size: 13;">@item.text_2</p>
            </div>
        </div>
    }
    else
    {
        <div class="picGallery">
            <img src="@Url.Content(item.HeaderPath)" alt="Image" />

            <a href="@Url.Action("ViewPage", "Home")">
                <div id="scanIcon">
                    <img src=img.png alt="imageView" />
                    <h1 style="font-size: 10px;">View Image</h1>
                </div>
            </a>
            <div class="desc2">
                <p style="font-size: 13;">@item.Text</p>
                <p style="font-size: 13;">@item.text_2</p>
            </div>
        </div>
    }
}

您可以缩短此时间。但您需要小心转义 @if html 中的嵌套代码块。理解输出应该是什么也变得更加困难。

@foreach (var item in Model)
{
    var HeaderImage = item.HeaderPath;

    <div class="picGallery">
        <img src="@Url.Content(item.HeaderPath)" alt="Image" />

        <a href="@Url.Action("ViewPage", "Home")">
            @if (image != "")
            {
                // image exists
                var fileSavePath = Path.Combine(@"\\mainPage.com", "");

                <div>  </div>
            }
            else
            {
                <div id="scanIcon">
                    <img src=img.png alt="imageView" />
                    <h1 style="font-size: 10px;">View Image</h1>
                </div>
            }
        </a>
        <div class="desc2">
            <p style="font-size: 13;">@item.Text</p>
        </div>
    </div>
}