Razor .cshtml 视图文件中的图像文件路径

Question

在我正在创建的网站中，我尝试将 URL 存储到我的模型中并在视图中调用上传的图像。因此，当我在 HTML 的源代码中键入文件路径时，它工作正常。

<dd><img src="~/uploads/image.jpg" alt="ASP.NET" style="width:350px;height:260px" />
    </dd>

但是如果我尝试从模型中调用，URL 就会变得混乱。

@string imagePath = "~/uploads/" + Model.Picture;

 <dd><img src=@imagePath alt="ASP.NET" style="width:350px;height:260px" />
    </dd>

该代码链接到“http://localhost:60847/Controller/Details/~/uploads/image.jpg”。有人可以向我解释为什么它的工作方式不同吗？谢谢。

Answer 1

您缺少 src 属性值周围的引号。还要确保使用 Url.Content 辅助方法来获取正确的路径。您可以将 "~" 传递给此方法以获取您的应用根目录的正确路径。

@{ string imagePath = Url.Content("~/uploads/" + Model.Picture); };
<img src="@imagePath" alt="ASP.NET" style="width:350px;height:260px" />

或甚至没有变量的单个衬垫

<img src="@Url.Content("~/uploads/" + Model.Picture)"  />

Image file path in Razor .cshtml view file