MVC 5 应用程序 - 使用图像而不是标签文本的复选框列表

MVC 5 app - Checkbox List using Images Instead of Label Text

我正在创建一个 MVC 应用程序。其中一个页面需要一个包含动态复选框列表的字段。要显示的复选框的实际数量由 SQL table 中的行数控制。每行都是一个复选框。我已经想出如何执行此操作并使用以下代码在页面上显示它们。此示例包含一个动态货币列表,每种货币都由一个复选框表示。此示例在每个复选框旁边显示一个标签,描述货币是什么(例如,美元)。然而,真正需要的是显示图像(它将作为 byte[] 类型包含在模型中)。我不确定如何完成此操作,因为 MVC 不支持任何类似 @Html.ImageFor 的东西。这可能比我想象的要简单,但我无法弄清楚如何将图像放置在 @Html.LabelFor 当前所在的位置。

        @for (int i = 0; i < Model.CurrencyList.Count; i++)
        {
            <div>
                @Html.HiddenFor(x => x.CurrencyList[i].AdvertiserCurrencySupportId)
                @Html.CheckBoxFor(x => x.CurrencyList[i].Checked)
                @Html.LabelFor(x => x.CurrencyList[i].Checked, Model.CurrencyList[i].Currency)
            </div>
        }

您应该能够使用基本的图片标签,在需要的地方插入数据

<img src="@Model.CurrencyList[i].ImageUrl">

既然你有字节数组,看起来你想使用内联图像,所以你应该能够用普通的 HTML:

<img src="data:image/png;base64,@Convert.ToBase64String(Model.CurrencyList[i].ImageBytes)">

但是您最好使用指向 URL 的普通图像,因为内联图像会占用大量带宽,因为每次加载页面时都需要拉动它们,所以您不需要'获取任何浏览器缓存。