2011-01-16 16 views
11

Próbuję przenieść starego pomocnika HTML.Image, którego jestem pewien, że wszyscy używali tego samego lub innego punktu, i mam problemy. Dodaje się kompiluje grzywny:Pomocy maszynki do golenia i HTML-u

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

Ale gdy próbuję użyć go w widoku po prostu pisze:

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

i nie wyświetla obrazu. Czy ktoś może pomóc?

Oto HTML.Image kod pomocnika że używam:

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(); 
    } 

} 

Odpowiedz

17

maszynki widok silnik automatycznie ciągi HTML-ewakuacyjne świadczonych przez @ -Blokuje.
Aby renderować rzeczywisty kod HTML, należy wpisać implementację IHtmlString w bloku blokującym @.

Zmień metodę, aby zwrócić HtmlString zamiast string.

+0

Niesamowite człowieka. Dzięki. Bardzo to doceniam. Sprawdzę poprawną odpowiedź, jak tylko przepełnienie stosu pozwoli mi ... mówi, że muszę poczekać. – jsteve81

1

chciałbym spróbować owijania url obrazu w wywołaniu metody zawartości URL jako tak

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

że należy przekonwertować względny adres URL do bezwzględny, gdy strona jest zaczerwieniona w przeglądarce

+0

Nie rozumiesz problemu. – SLaks

+0

Tak, masz rację. Napisałoby to dosłownie tak, jak on to zrobił – Hakeem

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; 
    } 

tak jak to przetestowano i działa idealnie. Potrzebowałem czegoś takiego, aby połączyć nazwę obrazu z modelu dzięki.

i ta też działa.

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

miałem ten sam problem i używałem MvcHtmlString jako typ zamian za te metody 2 przedłużacza i działa

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)); 
    } 
} 
Powiązane problemy