如何将 html 实体放入 Asp.net mvc Html helper EditorFor placeholder

Question

如果我使用原始 html <input /> 和占位符，例如：

<input id="TextSearch" name="TextSearch" placeholder="&#xf002;" type="text" value="" style="font-family: 'FontAwesome'" />

它呈现如下： 那也行。但是如果我使用 Asp.net mvc Html helper like:

@Html.EditorFor(m => m.TextSearch, new { placeholder = "", style="font-family: 'FontAwesome';" })

它呈现如下： 它无法呈现 FontAwesome 图标。它被视为字符串。

如何使用 Html 助手 @Html.EditorFor() 正确渲染它？

Answer 1

您需要为此使用 HttpUtility.HtmlDecode，因此您的 HTMLHelper 应该如下所示，

@Html.EditorFor(m => m.TextSearch, new { htmlAttributes = new { @PlaceHolder = HttpUtility.HtmlDecode(""), @Style = "font-family: 'FontAwesome'" } })

Answer 2

您将 placeholder 和 style HTML 属性作为 additionalViewData 传递，而不是 htmlAttributes（参见 EditorFor 和 2 个重载here)。带有 HttpUtility.HtmlDecode() 的简单 TextBoxFor 应该适用于所有 MVC 版本：

@Html.TextBoxFor(m => m.TextSearch, new { @placeholder = HttpUtility.HtmlDecode(""), @style = "font-family: 'FontAwesome'" })

请注意 htmlAttributes 在 EditorFor 中的用法。如果您使用的是 MVC 版本 5.1+，则应使用此 EditorFor 设置，否则使用 TextBoxFor 助手，如上所述：

@Html.EditorFor(m => m.TextSearch, new { htmlAttributes = new { @placeholder = HttpUtility.HtmlDecode(""), @style = "font-family: 'FontAwesome'" }})

参见 this fiddle 以了解这两个助手的区别。