使用Twitter Bootstrap在@ html.actionlink中显示html

Mar*_*ark 41 asp.net asp.net-mvc asp.net-mvc-3 twitter-bootstrap

我正在使用Twitter Bootstrap,并尝试使我的链接ASP.Net MVC看起来不错.

但是,下面链接中的<i class = ...是html编码,而不是作为html发送到浏览器:

    @Html.ActionLink("<i class='icon-user icon-white'></i> Create New", "Create", "", New With {Key .class="btn btn-primary"} )
Run Code Online (Sandbox Code Playgroud)

按钮如何出现

有没有办法保持<i class = ... as html,以便按钮显示正确?

Jon*_*ood 51

而不是使用@Html.ActionLink(),只需<a>自己写出标签.您可以使用@Url.Action()获取HREF属性的操作的URL.

@Html助手都不错,但他们不会总是提供您需要的灵活性.


mar*_*101 16

我正在处理同样的问题,但是想继续使用帮助器,因为我正在制作一个Ajax按钮.

我最终得到了这两个辅助方法,每个辅助方法一个:

public static MvcHtmlString IconActionLink(this AjaxHelper helper, string icon, string text, string actionName, string controllerName, object routeValues, AjaxOptions ajaxOptions, object htmlAttributes)
{
    var builder = new TagBuilder("i");
    builder.MergeAttribute("class", icon);
    var link = helper.ActionLink("[replaceme] " + text, actionName, controllerName, routeValues, ajaxOptions, htmlAttributes).ToHtmlString();
    return new MvcHtmlString(link.Replace("[replaceme]", builder.ToString()));
}

public static MvcHtmlString IconActionLink(this HtmlHelper helper, string icon, string text, string actionName, string controllerName, object routeValues, object htmlAttributes)
{
    var builder = new TagBuilder("i");
    builder.MergeAttribute("class", icon);
    var link = helper.ActionLink("[replaceme] " + text, actionName, controllerName, routeValues, htmlAttributes).ToHtmlString();
    return new MvcHtmlString(link.Replace("[replaceme]", builder.ToString()));
}
Run Code Online (Sandbox Code Playgroud)

只需将它们放在项目的静态类中,编译就可以看到它们(您可能需要在页面上添加using语句).

使用帮助程序时,您可以使用"icon-plus"甚至"icon-plus icon-white"作为图标字符串.