将图像渲染到剃刀视图 Cshtml ..？答案

【问题标题】：Rendering Images to razor view Cshtml ..?将图像渲染到剃刀视图 Cshtml ..？
【发布时间】：2015-10-21 12:31:20
【问题描述】：

我创建了一个图片上传。唯一的问题是，当我上传图像时，上传的图像不会显示在剃刀视图（后端编辑器）中，所以当有人来编辑此信息时，它是否会显示“选择文件”以上传，即使有是一个存储在数据库中并显示在前端的..

这是我的代码：- 控制器

public class FileUploadAPIController : Controller
    {
        private readonly MainDbContext _db;

        public FileUploadAPIController()
        {
            _db = new MainDbContext();
        }

        [HttpPost]
        public ActionResult Save(IEnumerable<HttpPostedFileBase> files, int id)
        {
            if (files != null)
            {
                foreach (var file in files)
                {
                    var fileName = Path.GetFileName(file.FileName);
                    var folder = Server.MapPath("~/Images/ManagerPictures/" + id);
                    if (!Directory.Exists(folder))
                    {
                        Directory.CreateDirectory(folder);
                    }

                    var physicalPath = Path.Combine(folder, fileName);
                    file.SaveAs(physicalPath);

                    var Manager = _db.Managers.Find(id);
                    Manager.ManagerPicture = "/manage/Images/ManagerPictures/" + id + "/" + fileName;

                    _db.SaveChanges();
                }
            }
            return Content("");
        }


        public ActionResult Remove(string[] fileNames, int id)
        {

            var Manager = _db.Managers.Find(id);
            Manager.ManagerPicture = null;
            _db.SaveChanges();

            return Content("");
        }

        private IEnumerable<string> GetFileInfo(IEnumerable<HttpPostedFileBase> files)
        {
            return
                from a in files
                where a != null
                select string.Format("{0} ({1} bytes)", Path.GetFileName(a.FileName), a.ContentLength);
        }
    }

.cshtml：

<div id="example">
    <h1>Manager Photo:</h1>

    @(Html.Kendo().Upload()
                      .Name("Files")
                      .Multiple(false)
                      .Async(a => a
                          .Save("Save", "FileUploadApi", new { id = Model.Manager.Id })
                          .Remove("Remove", "FileUploadApi", new { id = Model.Manager.Id })
                          .AutoUpload(true))            
    )

    <img src="@Url.Content("~/manage/Images/ManagerPictures/")" />
    <img src="@Url.Action("GetFileInfo", "FileUploadApi", new { id = Model.Manager.Id })" />
</div>

有没有人有任何提示/帮助将我推向正确的方向？提前致谢。

注意：在上面的 cshtml 中，您可以看到我已尝试显示图像，但不完全确定这是否是正确的方法..

【问题讨论】：

I have atttempted to display the image -- 在哪里？我看到 2 个图像标签都具有无效的 src 属性。第一个似乎是目录列表而不是图像。第二个是需要附加文件的多部分帖子的操作的获取（对于 img src 无效）。
对于初学者来说，img url 指向一个目录，而不是一个文件<img src="@Url.Content("~/manage/Images/ManagerPictures/")" />
试试<img src="@Url.Content("~/manage/Images/ManagerPictures/"+@Model.Manager.Id)" />
图像存储在数据库中的一个目录中，这就是为什么我认为我必须将其指向该目录
@JoelEtherton 我认为它正在工作，因为它成功地从文件夹中提取这些图像.. 虽然只显示为图标.. ?

标签： asp.net asp.net-mvc razor kendo-ui

【解决方案1】：

似乎我只是把事情复杂化了，解决办法是打电话：

<img src="@Model.Manager.ManagerPicture" />

在 Razor 视图中.. 但感谢大家的意见

【讨论】：