HtmlHelper渲染字典“键”和“值”作为属性

时间:2012-03-20 06:00:01

标签: asp.net-mvc-3 extension-methods html-helper

如果您觉得自己想要更多背景知识,我之前已经发布并接受了这一点。 Correctly making an ActionLink extension with htmlAttributes

这是一个后续问题。我的问题是我有两个自定义扩展,其中一个调用另一个。出于某种原因,htmlAttributes正在渲染出来。

<a Count="3" 
 Keys="System.Collections.Generic.Dictionary`2+KeyCollection[System.String,System.Object]"
 Values="System.Collections.Generic.Dictionary`2+ValueCollection[System.String,System.Object]"
 ...</a>

当我调用ActionImageLink2时会出现上述情况。 ActionImageLink2的目的只是添加属性对。如何才能使键和值正确呈现?

HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)

有些内容

以下是我的扩展方法

public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string imageUrl, string altText, RouteValueDictionary routeValues, string _imageClass = "", object htmlAttributes = null)
        {

            var image = new TagBuilder("img");
            image.MergeAttribute("src", imageUrl);
            image.MergeAttribute("alt", altText);
            if (string.IsNullOrEmpty(_imageClass) == false) image.MergeAttribute("class", _imageClass);
            var link = helper.ActionLink("[replaceme]", routeValues, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));

            return new MvcHtmlString(link.ToHtmlString().Replace("[replaceme]", image.ToString(TagRenderMode.SelfClosing)));
        }

        public static MvcHtmlString ActionImageLink2(this HtmlHelper helper, string imageUrl, string altText, RouteValueDictionary routeValues, string updateTarget, string _imageClass = "", object htmlAttributes = null)
        {
            RouteValueDictionary htmlAttr = HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes);
            htmlAttr.Add("data-ajaxget-click", "");
            htmlAttr.Add("data-ajax-update", (updateTarget.Contains("#") ? updateTarget : "#" + updateTarget));

            return helper.ActionImageLink(imageUrl, altText, routeValues, _imageClass, htmlAttr);
        }
        public static MvcHtmlString ActionLink(this HtmlHelper helper, string linkText, RouteValueDictionary routeValues, object htmlAttributes = null)
        {
            return helper.ActionLink(linkText, routeValues["Action"].ToString(), routeValues["Controller"].ToString(), routeValues, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
        }
    }

这是我的测试视图

每个ActionLink都有第二行,打印为ToHtmlString。下面的版画屏幕显示了结果。

@{RouteValueDictionary route = new RouteValueDictionary();
            route["Area"] = "";
            route["Controller"] = "Test";
            route["Action"] = "Test";
}

@Html.ActionLink("Html.ActionLink", route, new { style = "color: green" })
<br />
@Html.ActionLink("Html.ActionLink", route, new { style = "color: green" }).ToHtmlString()
<br />
<br />
@Html.ActionImageLink("https://stackoverflow.com/users/flair/511438.png", "alt text", route, "image class", new { style = "background-color: orange" })
<br />
@Html.ActionImageLink("https://stackoverflow.com/users/flair/511438.png", "alt text", route, "image class", new { style = "background-color: orange" }).ToHtmlString()
<br />
<br />
@Html.ActionImageLink2("https://stackoverflow.com/users/flair/511438.png", "alt text", route, "partialDiv", "image class", new { style = "background-color: orange" })
<br />
@Html.ActionImageLink2("https://stackoverflow.com/users/flair/511438.png", "alt text", route, "partialDiv", "image class", new { style = "background-color: orange" }).ToHtmlString()

enter image description here

2 个答案:

答案 0 :(得分:2)

我会做这样的事情:

public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string imageUrl, string altText, RouteValueDictionary routeValues, string _imageClass = "", IDictionary<String, object> htmlAttributes = null) 
{
    //...functionality omitted...
    var link = helper.ActionLink("[replaceme]", routeValues, htmlAttributes);
    //... other ....
}

public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string imageUrl, string altText, RouteValueDictionary routeValues, string _imageClass = "", object htmlAttributes = null)
{
    return helper.ActionImageLink(imageUrl, altText, routeValues, _imageClass, new RouteValueDictionary(htmlAttributes));
}

public static MvcHtmlString ActionLink(this HtmlHelper helper, string linkText, RouteValueDictionary routeValues, object htmlAttributes = null)
{
    return helper.ActionLink(linkText, routeValues, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
}

public static MvcHtmlString ActionLink(this HtmlHelper helper, string linkText, RouteValueDictionary routeValues, IDictionary<string, object> htmlAttributes = null)
{
    return helper.ActionLink(linkText, routeValues["Action"].ToString(), routeValues["Controller"].ToString(), routeValues, htmlAttributes);
}

简而言之:重载

答案 1 :(得分:1)

我认为问题在于这一行:

return helper.ActionImageLink(imageUrl, altText, routeValues, _imageClass, htmlAttr);
方法ActionImageLink2

。当您将htmlAttr变量传递给方法ActionImageLink时,它不再是匿名类型。

因此,您在ActionImageLink再次致电时会遇到问题

HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)

在调用上述函数之前,您是否尝试检查传入的类型?