如何在模式框内的视图中呈现图像集合

我有一个图像集合，我们的用户在我们的ASP.NET MVC应用程序中上传了这些图像。

用户上传图像后，我将图像保存在 Web UI 项目的内容/图像文件夹中，并将文件名填充到列表中，然后在partial view内的编辑器模板中呈现此对象。

我不确定为什么图像没有渲染，但以下是我的代码：

视图

<div class="bodyContent">
    @if (Model.RunEntryImagesDisplay != null && Model.RunEntryImagesDisplay.Count() > 0)
    {
        <span class="leftContent">
            @Html.Label("Images")
        </span><span class="rightContent"><span id="ImagesChildDialogLink" class="treeViewLink">
            Click here to View Images </span>
            <br />
            <span id="ImagesDisplayy"></span></span>
    }
</div>
<div id="Imagestreeview" title="Dialog Title" style="font-size: 10px; font-weight: normal;
    overflow: scroll; width: 800px; height: 450px; display: none;">
    @if (Model.RunEntryImagesDisplay != null && Model.RunEntryImagesDisplay.Count() > 0)
    {
        @Html.EditorFor(x => x.RunEntryImagesDisplay)
    }
</div>

编辑器模板

@model RunLog.Domain.Entities.RunLogEntryImagesDisplay
@Html.DisplayFor(x => x.FileStoredName, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileStoredName)
@Html.DisplayFor(x => x.FileName, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileName)
@Html.CheckBoxFor(x => x.Checked)
@Html.HiddenFor(x => x.Checked)
@Html.DisplayFor(x => x.FileExtension, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileExtension)
<img src="@Url.Action("Image", Model.FileStoredName)" alt="Image" />

JS模态盒

$(document).ready(function () {
    $('#ImagesChildDialogLink').click(function () {
        initImagesDailog();
    });

    function initImagesDailog() {
        var PartDialog;
        PartDialog = $("#Imagestreeview").dialog({ autoOpen: true, modal: false, resizable: true, draggable: true,
            stack: false, title: 'Parsed Test Exceptions', width: 1000, height: 400, buttons: { Close: function () {
                var btnText = '';
                $('.ui-dialog-buttonpane :button').each(function () {
                    if ($(this).text() == 'Close') {
                        btnText = 'Close';
                        $(this).text('Close');
                    }
                });
                if (btnText == 'Close') {
                    PartDialog.dialog("close");
                }
            }
            }
        });
        PartDialog.closest("div.ui-dialog").appendTo("#form");
    }
});

用于渲染图像的控制器操作

公共操作结果图像（字符串文件） {

    //byte[] image = 
    string loadLististFileName = file;
    string fileNamePath = loadLististFileName;
    string fileName = Path.GetFileName(fileNamePath);
    string dirName = Path.GetDirectoryName(fileNamePath);
    var fileData = IOHelper.GetFileImageData(fileName, dirName);
    return File(fileData, "image/jpg");
}

public static byte[] GetFileImageData(this string fileName, string filePath)
{
    var fullFilePath = string.Format("{0}/{1}", filePath, fileName);
    if (!File.Exists(fullFilePath))
        throw new FileNotFoundException("The file does not exist.", fullFilePath);
    return File.ReadAllBytes(fullFilePath);
}

编辑

我得到了它的工作，我的编辑器模板名称与模型列表属性不同。我甚至不需要使用动作图像来显示。刚刚使用了图像源标签。