2016-06-02 5 views
1

次のサンプル:「HTML属性」パラメータとは何ですか?

@Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" }) 

2番目のパラメータ、htmlAttributesは、

のHTML要素の属性を含むオブジェクトとして記載されてLabelFor方法の第二のオーバーロードを使用しているように見える

「HTML属性」という用語は何を意味し、このオブジェクトに使用できる構文は何ですか?

答えて

3

HTML要素は属性を持つことができます。例:ここでは

<div class="some-css-class" data-foo="bar" /> 

divの属性はclassdata-fooです。

htmlAttributes引数を受け入れるRazorのさまざまなHTMLヘルパー関数は、指定されたオブジェクトを属性に変換します。

これは、プロパティが属性名に変換され、その値がそれぞれの属性の値に変換される匿名型を使用して利用できます。例えば

new 
{ 
    @class = "some-css-class", 
    data_foo = "bar" 
} 

これは、上記の属性に変換します。プロパティ名で

下線はダッシュ(How to specify data attributes in razor, e.g., data-externalid="23151" on @this.Html.CheckBoxFor(...))に変換されます、そしてclass@How can I add a class attribute to an HTML element generated by MVC's HTML Helpers?)とそれをエスケープせずに使用することはできない予約語であるため@class@が必要です。あなたの代わりに、同様の辞書を渡すことができるように

は、またoverload accepting IDictionary<string, object> htmlAttributesあります:

new Dictionary<string, object> 
{ 
    { "class", "some-css-class" }, 
    { "data-foo", "bar" } 
} 
+0

感謝。 'class 'の前に' @ 'があるのはなぜですか? –

+1

これを加えるだけで、classはC#の予約語なので、 '@ class'の先頭に' @ 'が付きます。 – Beyers

+0

これは '@ 'でエスケープしない限り、プロパティ名として使用できない予約済みキーワードです。 – CodeCaster

0

このコードを使用:

@Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" }) 

は、アプリケーションが「System.Webの中で、このメソッドを使用しますが.Mvc " - 名前空間。そして、ここに2番目のパラメータhtmlAttributesがあります。これはIDictionary型の属性です。 HTML属性を入力して値を設定できます。

例:

@Html.LabelFor(m => m.Email, new { @class = "SmallInput", value = "someValue", data_validationType = "email" }) 

次のHTMLコードになります:

<label class="SmallInput" for="Email" value="someValue" data-validataionType="email">SomeEmailLabelText</label> 
関連する問題