如何在ASP.NET MVC的HTML-5 data-*属性中使用破折号

 2023-02-17    342  

问题描述

我正在尝试使用 html5 data-属性在我的ASP中.净MVC 1项目. (我是C#和ASP.NET MVC Newbie.)

<%= Html.ActionLink("« Previous", "Search",
     new { keyword = Model.Keyword, page = Model.currPage - 1},
     new { @class= "prev", data-details = "Some Details"   })%>

上述HTMLATTRIBUTES中的”数据详细信息”给出以下错误:

如何在ASP.NET MVC的HTML-5 data-*属性中使用破折号

CS0746: Invalid anonymous type member declarator. Anonymous type members 
  must be declared with a member assignment, simple name or member access.

当我使用data_details时,它可以正常工作,但是我想它需要根据规格开始” data-“.

我的问题:

  • 有什么方法可以使此工作并使用HTML.ActionLink或类似的HTML帮助者使用HTML5数据属性?
  • 还有其他替代机制可以将自定义数据附加到元素上吗?此数据将在稍后由JS.
  • 处理

推荐答案

更新:MVC 3和较新版本对此具有内置支持.有关推荐的解决方案,请参见下面的Johnnyo的高度投资答案.

我认为没有任何直接的帮助者可以实现这一目标,但是我确实有两个想法可以尝试:

// 1: pass dictionary instead of anonymous object
<%= Html.ActionLink( "back", "Search",
    new { keyword = Model.Keyword, page = Model.currPage - 1},
    new Dictionary<string,Object> { {"class","prev"}, {"data-details","yada"} } )%>

// 2: pass custom type decorated with descriptor attributes
public class CustomArgs
{
    public CustomArgs( string className, string dataDetails ) { ... }

    [DisplayName("class")]
    public string Class { get; set; }
    [DisplayName("data-details")]
    public string DataDetails { get; set; }
}

<%= Html.ActionLink( "back", "Search",
    new { keyword = Model.Keyword, page = Model.currPage - 1},
    new CustomArgs( "prev", "yada" ) )%>

只是想法,尚未测试.

其他推荐答案

此问题已在ASP.NET MVC中解决.现在,它们自动将HTML属性属性下的下划线转换为破折号.他们对此很幸运,因为在html属性中不合法,因此MVC可以自信地暗示您在使用下划线时想要破折号.

例如:

@Html.TextBoxFor(vm => vm.City, new { data_bind = "foo" })

将在MVC 3:

中渲染这一点

<input data-bind="foo" id="City" name="City" type="text" value="" />

如果您仍在使用较旧版本的MVC,则可以通过创建我从MVC3的源代码借用的静态方法来模仿MVC 3正在做什么:

public class Foo {
    public static RouteValueDictionary AnonymousObjectToHtmlAttributes(object htmlAttributes) {
        RouteValueDictionary result = new RouteValueDictionary();
        if (htmlAttributes != null) {
            foreach (System.ComponentModel.PropertyDescriptor property in System.ComponentModel.TypeDescriptor.GetProperties(htmlAttributes)) {
                result.Add(property.Name.Replace('_', '-'), property.GetValue(htmlAttributes));
            }
        }
        return result;
    }
}

然后您可以这样使用:

<%: Html.TextBoxFor(vm => vm.City, Foo.AnonymousObjectToHtmlAttributes(new { data_bind = "foo" })) %>

这将渲染正确的数据 – *属性:

<input data-bind="foo" id="City" name="City" type="text" value="" />

其他推荐答案

它比上面建议的所有内容都容易.
MVC中的数据属性(包括破折号( – )使用下划线(_).

<%= Html.ActionLink("« Previous", "Search",
 new { keyword = Model.Keyword, page = Model.currPage - 1},
 new { @class= "prev", data_details = "Some Details"   })%>

我看到Johnnyo已经提到了这一点.

以上所述是小编给大家介绍的如何在ASP.NET MVC的HTML-5 data-*属性中使用破折号,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对77isp云服务器技术网的支持!

原文链接:https://77isp.com/post/34262.html

=========================================

https://77isp.com/ 为 “云服务器技术网” 唯一官方服务平台,请勿相信其他任何渠道。