HTML in Html.ActionLink () einfügen, plus kein Linktext?

Ich habe zwei Fragen:

1. Ich frage mich, wie ich Html.ActionLink()in einer MVC-Ansicht keinen Linktext anzeigen kann (eigentlich ist dies der Fall Site.Master).

Es gibt keine überladene Version, die keinen Linktext zulässt. Wenn ich versuche, nur ein Leerzeichen zu übergeben string, teilt mir der Compiler mit, dass eine nicht leere Zeichenfolge erforderlich ist.

Wie kann ich das beheben?

2. Ich muss <span>Tags in das Ankertag einfügen, aber es funktioniert nicht mit Html.ActionLink();. Ich möchte die folgende Ausgabe sehen:

   Span Text

Wie kann ich Tags in das Ankertag in ASP.NET MVC einfügen?

Anstatt Html.ActionLink zu verwenden, können Sie eine URL über Url.Action rendern

<a href="<%= Url.Action("Index", "Home") %>"><span>Text</span></a>
<a href="@Url.Action("Index", "Home")"><span>Text</span></a>

Und um eine leere URL zu machen, die Sie haben könnten

<a href="<%= Url.Action("Index", "Home") %>"></a>
<a href="@Url.Action("Index", "Home")"></a>

Eine benutzerdefinierte HtmlHelper-Erweiterung ist eine weitere Option. Hinweis : ParameterDictionary ist mein eigener Typ. Sie könnten ein RouteValueDictionary ersetzen, müssten es aber anders erstellen.

public static string ActionLinkSpan( this HtmlHelper helper, string linkText, string actionName, string controllerName, object htmlAttributes )
{
    TagBuilder spanBuilder = new TagBuilder( "span" );
    spanBuilder.InnerHtml = linkText;

    return BuildNestedAnchor( spanBuilder.ToString(), string.Format( "/{0}/{1}", controllerName, actionName ), htmlAttributes );
}

private static string BuildNestedAnchor( string innerHtml, string url, object htmlAttributes )
{
    TagBuilder anchorBuilder = new TagBuilder( "a" );
    anchorBuilder.Attributes.Add( "href", url );
    anchorBuilder.MergeAttributes( new ParameterDictionary( htmlAttributes ) );
    anchorBuilder.InnerHtml = innerHtml;

    return anchorBuilder.ToString();
}

Hier ist eine (niedrige und schmutzige) Problemumgehung für den Fall, dass Sie Ajax oder eine Funktion verwenden müssen, die Sie nicht verwenden können, wenn Sie manuell einen Link erstellen (mithilfe eines Tags):

<%= Html.ActionLink("LinkTextToken", "ActionName", "ControllerName").ToHtmlString().Replace("LinkTextToken", "Refresh <span class='large sprite refresh'></span>")%>

Sie können jeden Text anstelle von 'LinkTextToken' verwenden. Er muss nur ersetzt werden. Es ist nur wichtig, dass er nirgendwo anders in actionlink vorkommt.

Verwenden Sie einfach Url.Actionanstelle von Html.ActionLink:

<li id="home_nav"><a href="<%= Url.Action("ActionName") %>"><span>Span text</span></a></li>

Das hat bei mir immer gut funktioniert. Es ist nicht chaotisch und sehr sauber.

<a href="@Url.Action("Index", "Home")"><span>Text</span></a>

Am Ende hatte ich eine benutzerdefinierte Erweiterungsmethode. Wenn Sie versuchen, HTML in ein Ankerobjekt einzufügen, kann der Linktext entweder links oder rechts vom inneren HTML stehen. Aus diesem Grund habe ich mich dafür entschieden, Parameter für linkes und rechtes inneres HTML bereitzustellen - der Linktext befindet sich in der Mitte. Sowohl linkes als auch rechtes inneres HTML sind optional.

Erweiterungsmethode ActionLinkInnerHtml:

    public static MvcHtmlString ActionLinkInnerHtml(this HtmlHelper helper, string linkText, string actionName, string controllerName, RouteValueDictionary routeValues = null, IDictionary<string, object> htmlAttributes = null, string leftInnerHtml = null, string rightInnerHtml = null)
    {
        // CONSTRUCT THE URL
        var urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
        var url = urlHelper.Action(actionName: actionName, controllerName: controllerName, routeValues: routeValues);

        // CREATE AN ANCHOR TAG BUILDER
        var builder = new TagBuilder("a");
        builder.InnerHtml = string.Format("{0}{1}{2}", leftInnerHtml, linkText, rightInnerHtml);
        builder.MergeAttribute(key: "href", value: url);

        // ADD HTML ATTRIBUTES
        builder.MergeAttributes(htmlAttributes, replaceExisting: true);

        // BUILD THE STRING AND RETURN IT
        var mvcHtmlString = MvcHtmlString.Create(builder.ToString());
        return mvcHtmlString;
    }

Anwendungsbeispiel:

Hier ist ein Anwendungsbeispiel. Für dieses Beispiel wollte ich nur das innere HTML auf der rechten Seite des Linktextes ...

@Html.ActionLinkInnerHtml(
    linkText: "Hello World"
        , actionName: "SomethingOtherThanIndex"
        , controllerName: "SomethingOtherThanHome"
        , rightInnerHtml: "<span class=\"caret\" />"
        )

Ergebnisse:

Dies führt zu folgendem HTML ...

<a href="/SomethingOtherThanHome/SomethingOtherThanIndex">Hello World<span class="caret" /></a>

Ich dachte, dies könnte nützlich sein, wenn Bootstrap und einige Glypicons verwendet werden:

<a class="btn btn-primary" 
    href="<%: Url.Action("Download File", "Download", 
    new { id = msg.Id, distributorId = msg.DistributorId }) %>">
    Download
    <span class="glyphicon glyphicon-paperclip"></span>
</a>

Daraufhin wird ein A-Tag mit einem Link zu einem Controller und einem schönen Büroklammersymbol angezeigt, das einen Download-Link darstellt, und die HTML-Ausgabe wird sauber gehalten

Hier ist eine übermäßige Erweiterung der Antwort von @ tvanfosson. Ich war davon inspiriert und habe beschlossen, es allgemeiner zu gestalten.

    public static MvcHtmlString NestedActionLink(this HtmlHelper htmlHelper, string linkText, string actionName,
        string controllerName, object routeValues = null, object htmlAttributes = null,
        RouteValueDictionary childElements = null)
    {
        var htmlAttributesDictionary = HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes);

        if (childElements != null)
        {
            var urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);

            var anchorTag = new TagBuilder("a");
            anchorTag.MergeAttribute("href",
                routeValues == null
                    ? urlHelper.Action(actionName, controllerName)
                    : urlHelper.Action(actionName, controllerName, routeValues));
            anchorTag.MergeAttributes(htmlAttributesDictionary);
            TagBuilder childTag = null;

            if (childElements != null)
            {
                foreach (var childElement in childElements)
                {
                    childTag = new TagBuilder(childElement.Key.Split('|')[0]);
                    object elementAttributes;
                    childElements.TryGetValue(childElement.Key, out elementAttributes);

                    var attributes = HtmlHelper.AnonymousObjectToHtmlAttributes(elementAttributes);

                    foreach (var attribute in attributes)
                    {
                        switch (attribute.Key)
                        {
                            case "@class":
                                childTag.AddCssClass(attribute.Value.ToString());
                                break;
                            case "InnerText":
                                childTag.SetInnerText(attribute.Value.ToString());
                                break;
                            default:
                                childTag.MergeAttribute(attribute.Key, attribute.Value.ToString());
                                break;
                        }
                    }
                    childTag.ToString(TagRenderMode.SelfClosing);
                    if (childTag != null) anchorTag.InnerHtml += childTag.ToString();
                }                    
            }
            return MvcHtmlString.Create(anchorTag.ToString(TagRenderMode.Normal));
        }
        else
        {
            return htmlHelper.ActionLink(linkText, actionName, controllerName, routeValues, htmlAttributesDictionary);
        }
    }

Es ist sehr einfach.

Wenn Sie so etwas wie ein Glyphikonsymbol und dann "Wunschliste" haben möchten,

<span class="glyphicon-heart"></span> @Html.ActionLink("Wish List (0)", "Index", "Home")

Meine Lösung mit Bootstrap-Komponenten:

<a class="btn btn-primary" href="@Url.Action("resetpassword", "Account")">
    <span class="glyphicon glyphicon-user"></span> Reset Password
</a>

Bitte versuchen Sie es mit dem folgenden Code, der Ihnen helfen kann.

 @Html.ActionLink(" SignIn", "Login", "Account", routeValues: null, htmlAttributes: new {  id = "loginLink" ,**@class="glyphicon glyphicon-log-in"** })