Question

我想在我的自定义HTML帮助程序中使用字体真棒图标，但我无法这样做。

以下是我的尝试：

HTML HELPER

   public static MvcHtmlString MenuLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, object routeValues, object htmlAttributes)
    {
        var currentAction = htmlHelper.ViewContext.RouteData.GetRequiredString("action");
        var currentController = htmlHelper.ViewContext.RouteData.GetRequiredString("controller");
        var currentArea = htmlHelper.ViewContext.RouteData.DataTokens["area"];

        var builder = new TagBuilder("li")
        {
            InnerHtml = htmlHelper.ActionLink(linkText, actionName, controllerName, routeValues, htmlAttributes).ToHtmlString()
        };
        if (String.Equals(controllerName, currentController, StringComparison.CurrentCultureIgnoreCase) && String.Equals(actionName, currentAction, StringComparison.CurrentCultureIgnoreCase))
            builder.AddCssClass("active");
        //builder.AddCssClass("btn");

        return new MvcHtmlString(builder.ToString());
    }
}

自定义操作链接

     @Html.MenuLink("Resume Center", "Index", "Resume", null, new { @class = "btn btn-block"})

我修改了上面的链接，但它没有按预期工作。下面的非工作示例。

 @Html.MenuLink("<i class='fa fa - file'></i> Resume Center", "Index", "Resume", null, new { @class = "btn btn-block"})

Custom Helper呈现的原始HTML：

<li class="active">
    <a class="btn btn-block" href="/Resume">Resume Center</a>
</li>

我想要像

这样的东西

<li class="active">
    <a class="btn btn-block" href="/Resume">
        <i class="fa fa-file"></i>Resume Center
    </a>
</li>

请帮帮我。

Answer 1

ActionLink()仅生成<a>标记。您需要使用自己的代码替换InnerHtml = htmlHelper.ActionLink(...)以手动构建html。

    public static MvcHtmlString MenuLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, object routeValues, object htmlAttributes)
    {
        var currentAction = htmlHelper.ViewContext.RouteData.GetRequiredString("action");
        var currentController = htmlHelper.ViewContext.RouteData.GetRequiredString("controller");
        var currentArea = htmlHelper.ViewContext.RouteData.DataTokens["area"];
        // Build the icon and display text elements
        StringBuilder innerHtml = new StringBuilder();
        TagBuilder icon = new TagBuilder("i");
        icon.AddCssClass("fa fa-file");
        innerHtml.Append(icon.ToString());
        TagBuilder span = new TagBuilder("span");
        span.InnerHtml = linkText;
        innerHtml.Append(span.ToString());
        // Build the link
        TagBuilder link = new TagBuilder("a");
        UrlHelper urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);
        string url = urlHelper.Action(actionName, controllerName, routeValues);
        link.MergeAttribute("href", url);
        link.MergeAttributes(new RouteValueDictionary(htmlAttributes));
        link.InnerHtml = innerHtml.ToString();
        // Build the li element
        TagBuilder li = new TagBuilder("li");
        li.InnerHtml = link.ToString();
        if (String.Equals(controllerName, currentController, StringComparison.CurrentCultureIgnoreCase) && String.Equals(actionName, currentAction, StringComparison.CurrentCultureIgnoreCase))
        {
            li.AddCssClass("active");
        }
        // Return the html
        return new MvcHtmlString(li.ToString());
    }
}

如何在ASP.Net MVC 5应用程序中的自定义HTML帮助器中添加字体真棒图标

1 个答案: