Бритва и HTML-помощники

Я пытаюсь перенести старый помощник HTML.Image, который, я уверен, каждый использовал в какой-то момент, и у меня возникают проблемы. Следующие компилируются:

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

Но когда я пытаюсь использовать его в представлении, он просто пишет:

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

И не отображает изображение. Может ли кто-нибудь помочь?

Вот код хелпера HTML.Image, который я использую:

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

}

Ответы

Ответ 1

Механизм просмотра Razor автоматически выведет строки с поддержкой HTML @ -blocks.
Чтобы отобразить фактический HTML, вам нужно написать реализацию IHtmlString в @ -block.

Измените свой метод, чтобы вернуть HtmlString вместо string.

Ответ 2

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

как это было проверено и работает отлично. Мне нужно было что-то вроде этого, чтобы объединить имя изображения с моделью.

и этот тоже работает.

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

Ответ 3

Я бы попытался обернуть URL-адрес изображения при вызове метода Url Content таким образом

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

который должен преобразовать относительный url в абсолютный, когда страница будет сброшена в браузер

Ответ 4

У меня была та же проблема, и я использовал MvcHtmlString в качестве возвращаемого типа для этих 2 методов расширения и работает

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