Razor y HTML Helpers

Question

Estoy tratando de portar el antiguo HTML.Ayuda a la imagen, que estoy seguro que todos han usado en un momento u otro, y estoy teniendo problemas. A continuación se compila bien:

@Html.Image("my-id", "~/Content/my-img.png", "Alt Text") 

Pero cuando trato de usarlo en una vista simplemente escribe:

<img alt="Alt Text" id="my-id" src="/content/my-img.png" /> 

Y no muestra la imagen. ¿Alguien puede ayudar?

Aquí está el código ayudante HTML.Image que estoy usando: Motor de vista

public static class ImageHelper 
{ 
    public static string Image(this HtmlHelper helper, string id, string url, string alternateText) 
    { 
     return Image(helper, id, url, alternateText, null); 
    } 

    public static string Image(this HtmlHelper helper, string id, string url, string alternateText, object htmlAttributes) 
    { 
     // Instantiate a UrlHelper 
     var urlHelper = new UrlHelper(helper.ViewContext.RequestContext); 

     // Create tag builder 
     var builder = new TagBuilder("img"); 

     // Create valid id 
     builder.GenerateId(id); 

     // Add attributes 
     builder.MergeAttribute("src", urlHelper.Content(url)); 
     builder.MergeAttribute("alt", alternateText); 
     builder.MergeAttributes(new RouteValueDictionary(htmlAttributes)); 

     // Render tag 
     var ret = new MvcHtmlString(builder.ToString(TagRenderMode.SelfClosing)); 
     return ret.ToHtmlString(); 
    } 

} 

Answer 1

la navaja será automáticamente las cadenas HTML de escape emitido por @ -blocks.
Para representar HTML real, necesita escribir una implementación de IHtmlString en el @ -block.

Cambie su método para devolver HtmlString en lugar de string.

Answer 2

me gustaría probar envolviendo la URL de la imagen en una llamada al método de contenido de URL, por lo

@Url.Content("~/Content/my-img.png") 

que debe convertir la dirección URL relativa a absoluta cuando la página se vacía al navegador

Answer 3

public static HtmlString Image(this HtmlHelper helper, string id, string url, string alternateText) 
    { 
     return Image(helper, id, url, alternateText, null); 
    } 

    public static HtmlString Image(this HtmlHelper helper, string id, string url, string alternateText, object htmlAttributes) 
    { 
     // Instantiate a UrlHelper 
     var urlHelper = new UrlHelper(helper.ViewContext.RequestContext); 

     // Create tag builder 
     var builder = new TagBuilder("img"); 

     // Create valid id 
     builder.GenerateId(id); 

     // Add attributes 
     builder.MergeAttribute("src", urlHelper.Content(url)); 
     builder.MergeAttribute("alt", alternateText); 
     builder.MergeAttributes(new RouteValueDictionary(htmlAttributes)); 

     // Render tag 
     var ret = new MvcHtmlString(builder.ToString(TagRenderMode.SelfClosing)); 

     return ret; 
    } 

así como probado y funciona perfecto. Necesitaba algo como esto para concatenar el nombre de la imagen del modelo gracias.

y este también funciona.

<img src="@Url.Content("~/Content/Images/Flags/" + c.CountryCode + ".jpg") " alt=""/> 

Answer 4

que tenían el mismo problema y que había utilizado como MvcHtmlString tipo de cambio de estos métodos de extensión 2 y funciona

public static class ImageHelper 
{ 
    public static MvcHtmlString Image(this HtmlHelper helper, string id, string url, string alternateText) 
    { 
     return Image(helper, id, url, alternateText, null); 
    } 

    public static MvcHtmlString Image(this HtmlHelper helper, string id, string url, string alternateText, 
           object htmlAttributes) 
    { 
     var builder = new TagBuilder("img"); 

     builder.GenerateId(id); 

     builder.MergeAttribute("alt", alternateText); 
     builder.MergeAttribute("src",url); 

     builder.MergeAttributes(new RouteValueDictionary(htmlAttributes)); 

     return MvcHtmlString.Create(builder.ToString(TagRenderMode.SelfClosing)); 
    } 
}