asp.net-mvc - テキストとアイコン付きのアクションリンク?

Question

このリンクはきれいな HTML に含まれています。MVC ActionLinkにしたいです。しかし、それはどのように可能ですか。私は理解できません、簡単な方法はないようです。また？

<li class="active"><a href="#"><i class="icon-home icon-large"></i> Dashboard</a></li>

何か案は？

Answer 1

これを行うにはいくつかのオプションがあります。

オプション1：

<li class="active"><a href="@Url.Action("YourAction", "YourController")"><i class="icon-home icon-large"></i> Dashboard</a></li>

オプション2：

HtmlHelperの独自の拡張メソッドを作成します。このメソッドは、String / MvcHtmlStringを取り込んで、htmlでエンコードせずにリンクタグに配置します。

public static MvcHtmlString SpecialActionLink(this HtmlHelper html, String action, String controller, String innerHtml) {
    TagBuilder tag = new TagBuilder("a");
    tag.MergeAttribute("href", new UrlHelper(html.ViewContext.RequestContext).Action(action, controller));
    tag.InnerHtml = innerHtml;
    return new MvcHtmlString(tag.ToString(TagRenderMode.Normal));
}

（テストはしていませんが、その方法についてのアイデアが得られるはずです。）

Answer 2

<li class="active">


    @Html.ActionLink("Dashboard", //Title
                    "Index",      // Action
                    "Home",       // Controller
                    new { @class = "home-icon"}  // htmlAttributes 
                    )

</li>


.home-icon{   /*Some CSS to set the background image (not tested) */
   padding:16px;
   background:transparent url('path-to-image.png') .... ;
}

Answer 3

ActionLink は使用できません。唯一の方法は @url.action です

<a href="@Url.Action("View","Article",new {area="",id=id})"><span>This is a test</span></a>