1

我想从数据库中检索图像列表并将它们显示在视图上。所有图像都以“图像”数据类型格式存储在数据库中。下面是我的控制器、视图模型和视图。我不确定它是否正确,所以请帮忙。我刚刚使用了 Linq2SQL,因为它只是一个示例项目。请更正我的代码,并帮助我如何在视图上显示图像列表。我只是一个初学者,所以如果你能保持解决方案简单明了,那就太好了。

视图模型:

public class ImageViewModel
{
    public byte[] Image { get; set; }
    public int imageId { get; set; }
    public IEnumerable<int> imageList { get; set; }     
}

控制器: * (更新和解决) *

   public ActionResult Index()
{

    var imagesList = (from q in ctx.Images
                      select new Models.ImageViewModel
                      {
                      imageId = q.id
                      }).ToList();

    IEnumerable<int> imageIds = imagesList.Select(x=>x.imageId);
    Models.Test obj = new Models.Test();
    obj.imageList = imageIds;
    return View(obj);
}

    public ActionResult View(int imageId)
    {
        byte[] imageArray = (from q in ctx.Images
                             where q.id == imageId
                             select q.data.ToArray()).FirstOrDefault(); 
        return File (imageArray,"image/jpg");
    }

看法:

   @model MvcApplication3.Models.ImageViewModel

   @foreach (var id in Model.imageList)
{ 
    <img src="@Url.Action("View", "Home", new { imageId = id},null)" />
}
4

3 回答 3

4

进行一个新操作,为您的图像获取一个唯一标识符,使用该 IDbyte[]从您的数据库中获取一个,然后将其直接写入响应流,如下所示

Response.ContentType = "content type of your image";
//filecontents is the byte[]
Response.BinaryWrite(filecontents);

然后,每当您需要显示数据库中的图像时,您都可以像这样设置源

<img src="/Controller/Action/ImageId"/>
于 2013-04-18T12:25:34.193 回答
1

布里顿也推荐了这一点,但我会重申。

你应该有两个动作/视图来实现你想要的。一个检索单个图像,另一个是使用前面提到的操作检索单个图像的所有图像的列表。

这是我的意思的一个非常粗略的例子。我还没有对此进行测试以确保它可以编译,但它应该让您大致了解如何执行此操作。

class ImageLibrary
}
    public ActionResult List()
    {
        //I'm going to assume here you have some sort of service or repository for obtaining your images at this point.
        //This doesn't retrieve the actual image data, just the metadata. It's less of a hit on the DB this way
        var imagesList = imageService.ListAllImages()
        IEnumerable<int> imageIds = imagesList.Select(x=>x.ImageId)
        return View("List", imageIds)
    }

    public ActionResult View(int imageId)
    {
        var image = imageService.GetImage(imageId);

        var contentDisposition = new System.Net.Mime.ContentDisposition() { FileName = image.Name, Inline = true };
        Response.AppendHeader("Content-Disposition", contentDisposition.ToString());
        return File(image.Data, image.ContentType); //including content type since I'm assuming the image could be a jpg, gif, png, etc./
    }

}

并在ImageLibrary/List视图中。

@foreach(var id in Model)
{
    <img src="@Url.Action("View", "ImageLibrary", new {imageId = id})">
}
于 2013-04-18T13:58:41.673 回答
0

我不确定您是否将数据作为 base64 字符串获取,如果是这样,您可以尝试:

<img src="data:image/png;base64,@(item.bitimage)" alt="test.png" />

失败的尝试:

<img src="data:image/png;base64,@ToBase64String(item.bitimage)" alt="test.png" />

http://www.techerator.com/2011/12/how-to-embed-images-directly-into-your-html/

于 2013-04-18T12:13:11.770 回答