web-dev-qa-db-fra.com

MVC helper - utiliser @URL pour l'image src?

J'utilise MVC3 et j'ai un assistant simple qui dessine une boîte avec du texte et des icônes à l'intérieur pour une application de statut. Un extrait:

@helper Tile(string ID)
 {
 <div class="front defaulttile"> 
    <div class="notifybar" id="NotifyBarID" >
    <img alt="" src="@Url.Content("~/Images/img.jpg")" style="display: inline; margin-right: 5px;" />
    <p class="topstatusbartext" id="NotifyBarTextID" >Status bar text</p>
    </div>
etc...

Ce serait formidable d'utiliser @ Url.Content pour l'image src, mais je reçois une erreur, elle n'est pas disponible. Puis-je ajouter ou modifier quelque chose pour l'utiliser? Je préfère ne pas avoir à jongler avec les chemins et avoir un problème une fois que l'application est sur le serveur.

Merci!

asp.net-mvcasp.net-mvc-3html-helper
20
dex3703

On dirait que quelqu'un a posé la question mieux que moi. Regarde ça:

Dans ASP.NET MVC, comment puis-je utiliser l'aide Razor @ Url.Content () à partir du code C #?

Vous pouvez également utiliser @ Href dans un MVC Helper aussi, comme ceci:

src="@Href("../../Images/trend_up.png")" (whatever path is relative to the cshtml file)
-- or --
src="@Href("~/Images/trend_up.png")"

Ce qui précède est pour MVC3.

Dans MVC4, vous obtenez ce joli raccourci (notez le ~):

<img id="img1" src="~/Images/trend_up.png" />

Merci à Rick Anderson, Jon Galloway et Eilon Lipton pour l'aide.

40
dex3703

Dans MVC4, c'est vraiment amusant de pouvoir réutiliser le tilde, comme indiqué dans la réponse:

src="~/Images/trend_up.png"

N'oubliez pas que les références à ces images dans vos fichiers CSS ne reconnaîtront pas le ~ - MVC4 ou non.

Ce n'est pas le même problème cependant, comme la référence relative à une image dans l'URL CSS.
Par exemple, background: url('../Images/menus/menu-left.png') sera relative à l'emplacement du fichier CSS. Donc, si vous parvenez à conserver le fichier CSS par rapport aux autres dossiers d'application, vous êtes d'accord ...

4
DB Conner
    @helper Tile(string ID,UrlHelper url)
 {
 <div class="front defaulttile"> 
    <div class="notifybar" id="NotifyBarID" >
    <img alt="" src="@url.Content("~/Images/img.jpg")" style="display: inline; margin-right: 5px;" />
    <p class="topstatusbartext" id="NotifyBarTextID" >Status bar text</p>
    </div>
etc...
4
Refky Wahib