Đưa HTML vào bên trong Html.ActionLink (), cộng với Không có văn bản liên kết?

Tôi có hai câu hỏi:

1. Tôi tự hỏi làm thế nào tôi có thể hiển thị không có văn bản liên kết khi sử dụng Html.ActionLink()trong chế độ xem MVC (thực ra, đây là Site.Master).

Không có phiên bản quá tải không cho phép văn bản liên kết và khi tôi thử chuyển qua chỉ trong một khoảng trống string, trình biên dịch sẽ cho tôi biết nó cần một chuỗi không trống.

Làm thế nào tôi có thể sửa lỗi này?

2. Tôi cần đặt <span>các thẻ trong thẻ neo, nhưng nó không hoạt động Html.ActionLink();. Tôi muốn xem kết quả sau:

   Khoảng cách văn bản

Làm cách nào tôi có thể đặt các thẻ bên trong thẻ neo trong ASP.NET MVC?

Thay vì sử dụng Html.ActionLink, bạn có thể kết xuất một url thông qua Url.Action

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

Và để làm một url trống, bạn có thể có

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

Một phần mở rộng HtmlHelper tùy chỉnh là một tùy chọn khác. Lưu ý : ParameterDixi là loại của riêng tôi. Bạn có thể thay thế một RouteValueDipedia nhưng bạn phải xây dựng nó theo cách khác.

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();
}

Đây là cách giải quyết (thấp và bẩn) trong trường hợp bạn cần sử dụng ajax hoặc một số tính năng mà bạn không thể sử dụng khi tạo liên kết thủ công (sử dụng thẻ):

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

Bạn có thể sử dụng bất kỳ văn bản nào thay vì 'LinkTextToken', nó chỉ được thay thế, điều quan trọng là nó không xảy ra ở bất kỳ nơi nào khác trong liên kết hành động.

Chỉ sử dụng Url.Actionthay vì Html.ActionLink:

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

Điều này đã luôn làm việc tốt cho tôi. Nó không lộn xộn và rất sạch sẽ.

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

Tôi đã kết thúc với một phương pháp mở rộng tùy chỉnh. Đáng chú ý của nó, khi cố gắng đặt HTML bên trong một đối tượng Anchor, văn bản liên kết có thể ở bên trái hoặc bên phải của HTML bên trong. Vì lý do này, tôi đã chọn cung cấp các tham số cho HTML bên trong bên trái và bên phải - văn bản liên kết nằm ở giữa. Cả HTML bên trái và bên phải là tùy chọn.

Phương pháp mở rộng 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;
    }

Ví dụ về cách sử dụng:

Dưới đây là một ví dụ về việc sử dụng. Trong ví dụ này, tôi chỉ muốn html bên trong ở bên phải của văn bản liên kết ...

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

Các kết quả:

kết quả này trong HTML sau ...

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

Tôi nghĩ rằng điều này có thể hữu ích khi sử dụng bootstrap và một số glypicons:

<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>

Điều này sẽ hiển thị thẻ A, với một liên kết đến bộ điều khiển, với biểu tượng kẹp giấy đẹp trên đó để thể hiện một liên kết tải xuống và đầu ra html được giữ sạch sẽ

Đây là một bản mở rộng uber của câu trả lời của @ tvanfosson. Tôi đã được truyền cảm hứng từ nó và quyết định làm cho nó chung chung hơn.

    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);
        }
    }

Nó rất đơn giản.

Nếu bạn muốn có một cái gì đó như biểu tượng glyphicon và sau đó là "Danh sách mong muốn",

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

Giải pháp của tôi sử dụng các thành phần bootstrap:

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

Vui lòng thử bên dưới Mã có thể giúp bạn.

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