为什么自定义 html 帮助程序无法正确呈现标签

Question

我制作了 html 辅助方法

public static string MedalImage(this HtmlHelper helper, Color color)
    {
        var builder = new TagBuilder("img");
        switch (color)
        {
            case Color.Blue:
                builder.MergeAttribute("src", "/Content/Medals/blueMedal.png");
                break;
            default:
                builder.MergeAttribute("src", "/Content/Medals/redMedal.png");
                break;
        }
        builder.MergeAttribute("alt", "Image not found");
        return builder.ToString(TagRenderMode.SelfClosing);
    }

但是当我想像这样在视图中使用它时@Html.MedalImage(HtmlHelpers.Color.Red) 然后它呈现：

<img alt="Image not found" src="/Content/Medals/redMedal.png" />

在这种情况下，它不会生成图像，只会生成文本。

但是当我使用 @Html.Raw(Html.MedalImage(HtmlHelpers.Color.Red)) 时，它确实按预期工作并渲染了我的图像。有人能告诉我为什么吗？或者如何修复我的助手，这样我就不必使用 Html.Raw 方法？

Answer 1

MVC Razor 的标准行为是 HTML 对每个字符串进行 编码。唯一不会这样做的情况是对象是 IHtmlString，它只不过是字符串的包装器接口。

通过将字符串包装为 IHtmlString，Razor 会将其视为 'already encoded' 和 'ready to be sent as-is'。至少有两种方法可以做到这一点：

var htmlStr1 = new HtmlString(myStringThatContainsHtml); var htmlStr2 = new MvcHtmlString(myStringThatContainsHtml);

或应用于您的代码：

return new HtmlString(builder.ToString(TagRenderMode.SelfClosing)); return new MvcHtmlString(builder.ToString(TagRenderMode.SelfClosing));

然后您的方法签名需要更改：

public static IHtmlString MedalImage(...) { ... }

有两种方法的原因是历史性的。 MVC2 没有 IHtmlString 接口，它只有 MvcHtmlString class。从 MVC3 开始，创建了 IHtmlString 接口以及 class HtmlString，现在 MvcHtmlString 继承自 HtmlString。有关更多信息，请参阅 HtmlString vs. MvcHtmlString.

为什么自定义 html 帮助程序无法正确呈现标签

Why custom html helper doesn't render tag properly

html

c#

asp.net

html-helper