Comment afficher une image à partir d'un chemin dans asp.net MVC 4 et Razor view?

J'ai le modèle suivant:

public class Player
{


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

    }

Et, c'est mon .cshtml fichier:

@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>

Le résultat est un texte simple: 

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

Aussi, j'ai essayé la ligne suivante, et ça fonctionne:

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

Comment afficher cette image à partir de path? Le chemin de l'image pourrait-il être différent en fonction des paramètres? D'autres idées?

Je ne comprends pas vraiment maintenant comment fonctionne la syntaxe razor.

47
demandé sur Mahdi Alkhatib 2013-04-13 14:46:30

4 réponses

, À votre avis, essayez comme ceci 

  <img src= "@Url.Content(Model.ImagePath)" alt="Image" />
106
répondu Adithya 2013-04-13 11:27:51

Vous pouvez également essayer avec cette réponse: 

 <img src="~/Content/img/@Html.DisplayFor(model =>model.ImagePath)" style="height:200px;width:200px;"/>
6
répondu Dipal Kothari 2015-10-02 11:45:56 
 @foreach (var m in Model)
    {
      <img src="~/Images/@m.Url" style="overflow: hidden; position: relative; width:200px; height:200px;" />
    }
1
répondu Debendra Dash 2017-06-20 09:03:04

Essayez ceci, 

<img src= "@Url.Content(Model.ImagePath)" alt="Sample Image" style="height:50px;width:100px;"/>

(or)

<img src="~/Content/img/@Url.Content(model =>model.ImagePath)" style="height:50px;width:100px;"/>
1
répondu Parameswaran 2018-01-02 09:18:02