Question

我有一个小程序正在工作（大部分）。它从数据库返回一个商品代码并返回该代码的数量。然后我在Razor中有一个@foreach代码块来动态创建包含名称和数量的div。在其余代码中，有Knockout函数可自动更新显示。但是......我遇到的问题是尝试为每个div应用不同的背景颜色。

@foreach (var x in Model.Quantities)
{
    int itemCode = x.ItemEncode;
    string itemName = "";
    int quantity = x.Quantity;
    switch (itemCode)
    {
        case 11:
        <style>.getcolour {background-color: blue}</style>
            itemName = "Item A";
            break;
        case 12:
            <style>.getcolour {background-color: skyblue}</style>
            itemName = "Item B";
            break;
        case 21:
            <style>.getcolour {background-color: red}</style>
            itemName = "Item C";
            break;
        case 31:
            <style>.getcolour {background-color: pink}</style>
            itemName = "Item D";
            break;
        case 41:
            <style>.getcolour {background-color: purple}</style>
            itemName = "Item E";
            break;
        case 61:
            <style>.getcolour {background-color: green}</style>
            itemName = "Item F";
            break;
    }


    <div class="getcolour">
        <h3>@Html.Raw(itemName)</h3>
        <hr />
        <h2>@Html.Raw(quantity)</h2>
    </div>
}

itemNames和Quantities正确显示，因此foreach块正在工作，但每个div都使用Switch语句中的最后一种颜色（绿色）进行渲染。任何关于正确应用颜色的建议都将非常感激。

Answer 1

请试一试。

@foreach (var x in Model.Quantities)
{
    int itemCode = x.ItemEncode;
    string itemName = "";
    int quantity = x.Quantity;
    string bgColor = "";
    switch (itemCode)
    {
        case 11:
            bgColor = "blue";
            itemName = "Item A";
            break;
        case 12:
            bgColor = "skyblue";
            itemName = "Item B";
            break;
        case 21:
            bgColor = "red";
            itemName = "Item C";
            break;
        case 31:
            bgColor = "pink";
            itemName = "Item D";
            break;
        case 41:
            bgColor = "purple";
            itemName = "Item E";
            break;
        case 61:
            bgColor = "green";
            itemName = "Item F";
            break;
        default: break;
    }

    <div style="background-color:@bgColor">
        <h3>@Html.Raw(itemName)</h3>
        <hr />
        <h2>@Html.Raw(quantity)</h2>
    </div>
}

MVC Razor - 将颜色应用于动态生成的div标签

1 个答案: