Cómo mostrar un nombre de imagen dinámica con Razor

Question

Soy bastante nuevo en MVC y recientemente comencé un proyecto Asp.Net MVC3, usando el motor Razor view.

Por el momento estoy teniendo problemas para generar un nombre de imagen en una etiqueta html img con Razor.

Digamos que tengo una clase de auto en mi modelo, con una propiedad de cadena llamada ModelName. También tengo una carpeta con imágenes del modelo del automóvil, que llevan el nombre del modelo del automóvil, de modo que, por convención, puedo mostrar la imagen de un modelo específico, simplemente usando el nombre.

Desde mi controlador que pase por una colección de coches a mi modo de ver y hacer lo siguiente para mostrar una lista de imágenes Modelo del coche:

@foreach (var item in Model) { 
<img src='@item.ModelName.png' /> 
} 

Sin embargo, si intento funcionar esto, me sale el error:

Compiler Error Message: CS1061: 'string' does not contain a definition for 'png' and no extension method 'png' accepting a first argument of type 'string' could be found (are you missing a using directive or an assembly reference?)

también probé

@foreach (var item in Model) { 
    <img src='@{item.ModelName}.png' /> 
    } 

Pero eso se traduce en:

Compiler Error Message: CS1528: Expected ; or = (cannot specify constructor arguments in >declaration) Source Error:

Line 84: #line default Line 85: #line hidden Line 86: WriteLiteral(".png\' ">\r\n"); Line 88:

puedo conseguir alrededor de él haciendo:

@foreach (var item in Model) { 
    string imageName = string.Format("{0}.png", item.ModelName); 
    <img src='@imageName' /> 
    } 

Pero eso se siente muy torpe, seguramente debe haber una mejor manera ??

Answer 1

También puede hacer:

@foreach (var item in Model) 
{ 
    <img src="@(item.ModelName).png" /> 
} 

O hacer un ayudante:

public static MVCHtmlString Image<T>(this HtmlHelper helper, string name) 
{ 
    TagBuilder img=new TagBuilder("img"); 
    img.Attributes.Add("src", name+".png"); 
    return new MvcHtmlString(img.ToString()); 
} 

y utilizarlo como:

@foreach (var item in Model) 
{ 
    @Html.Image(item.ModelName) 
} 

Answer 2

@foreach (var item in Model._imageList) 
{ 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.FriendlyName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.CreateDate) 
     </td> 
     <td> 
      <img src="@Url.Content(item.ImagePath)" alt="Image" /> 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "UploadImageEdit", new { id = item.ImageID }) | 
      @Html.ActionLink("Details", "UploadImageDetails", new { id = item.ImageID }) | 
      @Html.ActionLink("Delete", "UploadImageDelete", new { id = item.ImageID }) 
     </td> 
    </tr> 
} 

Esto mostrará la imagen que se guardado en el sistema de archivos, pero la ruta del archivo es guardado en la base de datos mientras se utiliza un bucle foreach.