通过存储在 sql server 数据库中的路径显示图像答案

【问题标题】：display Image by the path stored in a sql server database通过存储在 sql server 数据库中的路径显示图像
【发布时间】：2017-04-17 11:23:15
【问题描述】：

我正在创建一个 asp.net MVC 4 应用程序，并且我正在尝试显示我已上传到文件夹的图像。我已将路径保存到 sql server 数据库，并且每个上传的图像都有自己的唯一 ID。我能够在表格中显示 Id 和路径，但我也希望能够查看图像。

这是它显示的内容：http://imgur.com/a/pPTvG

感谢您对此问题的任何帮助

型号

public partial class Image
{
    [Key]
    public int ID { get; set; }
    public string ImagePath { get; set; }
}

控制器

  public class HomeController : Controller
    {
        private IImageRepository repository;
        public HomeController(IImageRepository imageRepository)
        {
            //this.repository = imageRepository;
            repository = imageRepository;
        }

        public ViewResult GetImage(int ID)
    {
        Image Images = repository.Images
        .FirstOrDefault(x => x.ID == ID);
        return View(Images);

    }
    }

查看

    @model IEnumerable<MyProject.Models.Image>
@{
    ViewBag.Title = "Index";
}

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.ID)
        </th>
        <th>
            <h5><b>Image</b></h5>
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Heading)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.ImagePath)
        </th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td class="text-right">@item.ID</td>
            <td>
                <img class="img-thumbnail" width="150" height="150" src="@Url.Action("GetImage", "Home",new { item.ID })" />
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Heading)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ImagePath)
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
                @Html.ActionLink("Details", "Details", new { id = item.ID }) |
                @*@Ajax.ActionLink("Delete", "Delete", new { id = item.ID })*@

                @Ajax.ActionLink("Delete",
                  "Delete",
                new { id = item.ID },
                new AjaxOptions
                {
                    UpdateTargetId = (string)item.ImagePath,
                    InsertionMode = InsertionMode.Replace,
                    HttpMethod = "GET"
                })
            </td>
        </tr>
    }

</table>

【问题讨论】：

标签： c# asp.net-mvc image asp.net-mvc-4 razor

【解决方案1】：

你的图片来源有误：

<img class="img-thumbnail" width="150" height="150" src="@Url.Action("GetImage", "Home",new { item.ID })" />

它指向Home/Getimage/id。你需要设置图片的path：

如果您的模型中已经有 imagePath，只需将其绑定到图像源：

<img class="img-thumbnail" width="150" height="150" src="@item.ImagePath" />

【讨论】：

【解决方案2】：

试试这个：

 <img class="img-thumbnail" width="150" height="150" src="/folderpath/@item.ImagePath" />

【讨论】：