如何在 asp.net MVC 4 和 Razor 视图中显示来自路径的图像? [英] How to display an image from a path in asp.net MVC 4 and Razor view?

问题描述

我有以下模型:

公共类播放器{公共字符串图像路径{得到{返回~/Content/img/sql_error.JPG"；}}

而且，这是我的 .cshtml 文件:

@model SoulMasters.Models.Game.Player@{ViewBag.Title = "游戏";布局 = "~/Views/Shared/_GameLayout.cshtml";var imagePath = @Model.ImagePath;}<字段集><legend>玩家</legend><div class="display-field">@Html.DisplayFor(model => model.ImagePath)

@图像路径<div style="padding:10px;"><img src=@imagePath alt="示例图片" width="300px"/><img alt="asd" >模型.ImagePath;</img>

</fieldset>

结果是简单的文本:

~/Content/img/sql_error.JPG~/Content/img/sql_error.JPG示例图像 asd model.ImagePath;

另外，我尝试了以下行，并且有效:

<img src="~/Content/img/sql_error.JPG" alt="示例图片" width="300px"/>

如何显示路径中的图像?图像路径会因设置而异吗?还有其他想法吗?

我现在不太明白 razor 语法的工作原理.

解决方案

在你的 View 中尝试这样

I have the following model:

public class Player
{


    public String ImagePath
    {
        get
        {
            return "~/Content/img/sql_error.JPG";
        }

    }

And, this is my .cshtml file:

@model SoulMasters.Models.Game.Player

@{
ViewBag.Title = "Game";
Layout = "~/Views/Shared/_GameLayout.cshtml";
var imagePath = @Model.ImagePath;
}

<fieldset>
<legend>Player</legend>

   <div class="display-field">
    @Html.DisplayFor(model => model.ImagePath)
</div>
@imagePath
<div style="padding:10px;">

    <img src=@imagePath alt="Sample Image" width="300px" />

    <img  alt="asd" >
        model.ImagePath;
    </img>
</div>
</fieldset>

The result is simple text:

~/Content/img/sql_error.JPG
~/Content/img/sql_error.JPG
Sample Image asd model.ImagePath;

Also, I have tried the following line, and it works:

<img src="~/Content/img/sql_error.JPG" alt="Sample Image" width="300px" />

How to display that image from path? Could the image path be different based on settings? Any other ideas?

I don't really get it now on how razor syntax works.

解决方案

In your View try like this

  <img src= "@Url.Content(Model.ImagePath)" alt="Image" />

这篇关于如何在 asp.net MVC 4 和 Razor 视图中显示来自路径的图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！