Действие Изображение MVC3 Razor

Каков наилучший способ заменить ссылки на изображения с помощью Razor в MVC3. Я просто делаю это в данный момент:

Edit 

Есть ли способ лучше?

Вы можете создать метод расширения для HtmlHelper для упрощения кода в вашем CSHTML-файле. Вы можете заменить tags таким способом:

 // Sample usage in CSHTML @Html.ActionImage("Edit", new { id = MyId }, "~/Content/Images/Image.bmp", "Edit") 

Ниже приведен пример метода расширения для кода выше:

 // Extension method public static MvcHtmlString ActionImage(this HtmlHelper html, string action, object routeValues, string imagePath, string alt) { var url = new UrlHelper(html.ViewContext.RequestContext); // build the  tag var imgBuilder = new TagBuilder("img"); imgBuilder.MergeAttribute("src", url.Content(imagePath)); imgBuilder.MergeAttribute("alt", alt); string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing); // build the  tag var anchorBuilder = new TagBuilder("a"); anchorBuilder.MergeAttribute("href", url.Action(action, routeValues)); anchorBuilder.InnerHtml = imgHtml; // include the  tag inside string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal); return MvcHtmlString.Create(anchorHtml); } 

Вы можете использовать Url.Content который работает для всех ссылок, поскольку он переводит тильду ~ в корневой uri.

  Edit  

Основываясь на ответе Лукаса выше, это перегрузка, которая принимает имя controllerа как параметр, аналогичный ActionLink. Используйте эту перегрузку, когда ваше изображение связано с действием в другом controllerе.

 // Extension method public static MvcHtmlString ActionImage(this HtmlHelper html, string action, string controllerName, object routeValues, string imagePath, string alt) { var url = new UrlHelper(html.ViewContext.RequestContext); // build the  tag var imgBuilder = new TagBuilder("img"); imgBuilder.MergeAttribute("src", url.Content(imagePath)); imgBuilder.MergeAttribute("alt", alt); string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing); // build the  tag var anchorBuilder = new TagBuilder("a"); anchorBuilder.MergeAttribute("href", url.Action(action, controllerName, routeValues)); anchorBuilder.InnerHtml = imgHtml; // include the  tag inside string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal); return MvcHtmlString.Create(anchorHtml); } 

Ну, вы можете использовать решение @Lucas, но есть и другой способ.

  @Html.ActionLink("Update", "Update", *Your object value*, new { @class = "imgLink"}) 

Теперь добавьте этот class в файл CSS или на свою страницу:

 .imgLink { background: url(YourImage.png) no-repeat; } 

С этим classом любая ссылка будет иметь желаемое изображение.

Это оказалось очень полезной нитью.

Для тех, у кого есть аллергия на фигурные скобки, вот VB.NET-версия ответов Лукаса и Крейка:

 Public Module ActionImage  Function ActionImage(html As HtmlHelper, Action As String, RouteValues As Object, ImagePath As String, AltText As String) As MvcHtmlString Dim url = New UrlHelper(html.ViewContext.RequestContext) Dim imgHtml As String 'Build the  tag Dim imgBuilder = New TagBuilder("img") With imgBuilder .MergeAttribute("src", url.Content(ImagePath)) .MergeAttribute("alt", AltText) imgHtml = .ToString(TagRenderMode.Normal) End With Dim aHtml As String 'Build the  tag Dim aBuilder = New TagBuilder("a") With aBuilder .MergeAttribute("href", url.Action(Action, RouteValues)) .InnerHtml = imgHtml 'Include the  tag inside aHtml = aBuilder.ToString(TagRenderMode.Normal) End With Return MvcHtmlString.Create(aHtml) End Function  Function ActionImage(html As HtmlHelper, Action As String, Controller As String, RouteValues As Object, ImagePath As String, AltText As String) As MvcHtmlString Dim url = New UrlHelper(html.ViewContext.RequestContext) Dim imgHtml As String 'Build the  tag Dim imgBuilder = New TagBuilder("img") With imgBuilder .MergeAttribute("src", url.Content(ImagePath)) .MergeAttribute("alt", AltText) imgHtml = .ToString(TagRenderMode.Normal) End With Dim aHtml As String 'Build the  tag Dim aBuilder = New TagBuilder("a") With aBuilder .MergeAttribute("href", url.Action(Action, Controller, RouteValues)) .InnerHtml = imgHtml 'Include the  tag inside aHtml = aBuilder.ToString(TagRenderMode.Normal) End With Return MvcHtmlString.Create(aHtml) End Function End Module 

Этот метод расширения также работает (для размещения в открытом статическом classе):

  public static MvcHtmlString ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions) { var builder = new TagBuilder("img"); builder.MergeAttribute("src", imageUrl); builder.MergeAttribute("alt", altText); var link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions); return new MvcHtmlString( link.ToHtmlString().Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)) ); } 

Чтобы добавить во все Awesome работу, начатую Luke, я отправляю еще одну, которая принимает значение classа css и рассматривает class и alt как необязательные параметры (действительные в ASP.NET 3.5+). Это позволит увеличить функциональность, но при этом необходимо восстановить количество перегруженных методов.

 // Extension method public static MvcHtmlString ActionImage(this HtmlHelper html, string action, string controllerName, object routeValues, string imagePath, string alt = null, string cssClass = null) { var url = new UrlHelper(html.ViewContext.RequestContext); // build the  tag var imgBuilder = new TagBuilder("img"); imgBuilder.MergeAttribute("src", url.Content(imagePath)); if(alt != null) imgBuilder.MergeAttribute("alt", alt); if (cssClass != null) imgBuilder.MergeAttribute("class", cssClass); string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing); // build the  tag var anchorBuilder = new TagBuilder("a"); anchorBuilder.MergeAttribute("href", url.Action(action, controllerName, routeValues)); anchorBuilder.InnerHtml = imgHtml; // include the  tag inside string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal); return MvcHtmlString.Create(anchorHtml); } 

изменение слайда Помощник

  public static IHtmlString ActionImageLink(this HtmlHelper html, string action, object routeValues, string styleClass, string alt) { var url = new UrlHelper(html.ViewContext.RequestContext); var anchorBuilder = new TagBuilder("a"); anchorBuilder.MergeAttribute("href", url.Action(action, routeValues)); anchorBuilder.AddCssClass(styleClass); string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal); return new HtmlString(anchorHtml); } 

Класс CSS

 .Edit { background: url('../images/edit.png') no-repeat right; display: inline-block; height: 16px; width: 16px; } 

Создать ссылку просто передать имя classа

  @Html.ActionImageLink("Edit", new { id = item.ID }, "Edit" , "Edit") 

Я присоединился к ответу от Лукаса и « Помощники ASP.NET MVC, объединив два объекта htmlAttributes вместе » и плюс имя controllerа следующего кода:

// Использование примера в CSHTML

  @Html.ActionImage("Edit", "EditController" new { id = MyId }, "~/Content/Images/Image.bmp", new { width=108, height=129, alt="Edit" }) 

И class расширения для кода выше:

 using System.Collections.Generic; using System.Reflection; using System.Web.Mvc; namespace MVC.Extensions { public static class MvcHtmlStringExt { // Extension method public static MvcHtmlString ActionImage( this HtmlHelper html, string action, string controllerName, object routeValues, string imagePath, object htmlAttributes) { //https://stackoverflow.com/questions/4896439/action-image-mvc3-razor var url = new UrlHelper(html.ViewContext.RequestContext); // build the  tag var imgBuilder = new TagBuilder("img"); imgBuilder.MergeAttribute("src", url.Content(imagePath)); var dictAttributes = htmlAttributes.ToDictionary(); if (dictAttributes != null) { foreach (var attribute in dictAttributes) { imgBuilder.MergeAttribute(attribute.Key, attribute.Value.ToString(), true); } } string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing); // build the  tag var anchorBuilder = new TagBuilder("a"); anchorBuilder.MergeAttribute("href", url.Action(action, controllerName, routeValues)); anchorBuilder.InnerHtml = imgHtml; // include the  tag inside string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal); return MvcHtmlString.Create(anchorHtml); } public static IDictionary ToDictionary(this object data) { //https://stackoverflow.com/questions/6038255/asp-net-mvc-helpers-merging-two-object-htmlattributes-together if (data == null) return null; // Or throw an ArgumentNullException if you want BindingFlags publicAttributes = BindingFlags.Public | BindingFlags.Instance; Dictionary dictionary = new Dictionary(); foreach (PropertyInfo property in data.GetType().GetProperties(publicAttributes)) { if (property.CanRead) { dictionary.Add(property.Name, property.GetValue(data, null)); } } return dictionary; } } } 

Это будет очень хорошо работать

 ">Edit 
Давайте будем гением компьютера.