2

次のようにして、タグに html 属性を追加できることを知っています。

var htmlAttributes = new RouteValueDictionary { { "data-foo", "bar" } };
var tag = new TagBuilder("div");
tag.MergeAttributes(htmlAttributes );
@tag

出力：

<div data-foo="bar"></div>

タグ ビルダーの代わりにマークアップを使用して、同様の方法で属性を追加できないか考えています。たぶん次のようなもの：

var htmlAttributes = new RouteValueDictionary { { "data-foo", "bar" } };
<div @htmlAttributes.ToHtmlAttributes() ></div>

期待される出力:

<div data-foo="bar"></div>

明らかに、この方法ではマージの競合を処理できません。ただし、2 番目の方法の方がはるかに読みやすいので、それだけの価値があると思います。

4

1 に答える 1

4

独自の拡張メソッドを作成できます。

namespace SomeNamespace
{
    public static class RouteValueDictionaryExtensions
    {
        public static IHtmlString ToHtmlAttributes(this RouteValueDictionary dictionary)
        {
            var sb = new StringBuilder();
            foreach (var kvp in dictionary)
            {
                sb.Append(string.Format("{0}=\"{1}\" ", kvp.Key, kvp.Value));
            }
            return new HtmlString(sb.ToString());
        }
    }
}

これは、あなたが説明したとおりに使用されます。

@using SomeNamespace    
@{
    var htmlAttributes = new RouteValueDictionary
        {
            {"data-foo", "bar"},
            {"data-bar", "foo"}
        };
}

<div @htmlAttributes.ToHtmlAttributes()> </div>

結果は次のとおりです。

<div data-foo="bar" data-bar="foo" > </div>

編集：

を使用したい場合はTagBuilder、代わりにそれを内部で使用する別の拡張機能を作成できます。

public static IHtmlString Tag(this HtmlHelper helper, 
                              RouteValueDictionary dictionary, 
                              string tagName)
{
    var tag = new TagBuilder(tagName);
    tag.MergeAttributes(dictionary);
    return new HtmlString(tag.ToString());
}

以下に示す使用法では、以前と同じ出力 html が得られます。

@Html.Tag(htmlAttributes, "div")
于 2013-09-04T16:08:17.070 に答える