Бритва ASP.NET MVC: условный атрибут в HTML

84

Код ниже не кажется чистым. Есть предложения по улучшению кода?

<li @if(ViewData["pagename"].ToString()=="Business details"){ <text>class="active" </text> } >
        <a  @if(ViewData["pagename"].ToString()=="Business details"){ <text>style="color: white; background-color: #08C; border: 1px solid #08C;" </text> }
            href="@Url.Action("BusinessDetails", "Business")">Business Details</a>
    </li> 
    <li @if (ViewData["pagename"].ToString() == "Booking policies"){ <text>class="active"</text> }> 
        <a  @if (ViewData["pagename"].ToString() == "Booking policies")
               { <text>style="color: white; background-color: #08C; border: 1px solid #08C;" </text> }
            href="@Url.Action("BookingPolicies", "Business")">Booking policies</a> 
    </li>
asp.net-mvc asp.net-mvc-3 razor Махеш
источник
Возможно, создать собственный помощник HTML, который будет отображать LI с элементами дочерних ссылок?
Ник Борк,

Ответы:

146

MVC имеет встроенные условные атрибуты ...

<div @{if (myClass != null) { <text>class="@myClass"</text> } }>Content</div>
<div class="@myClass">Content</div>

Если @myClass имеет значение null, он просто не будет использовать атрибут вообще ...

Я знаю, что это может не совсем решить вашу текущую проблему, но это заслуживает внимания!

http://weblogs.asp.net/jgalloway/archive/2012/02/16/asp-net-4-beta-released.aspx

jcreamer898
источник
Будьте осторожны, чтобы имя вашего класса не было «активным», иначе у вас будет атрибут класса записи. Понятия не имею почему.
ScottE
3
Есть ли способ добиться такого же поведения с нулевым уважением при вызове помощников html, передающих анонимный htmlPropertiesобъект? Например, я хочу условно передать атрибут disabled, например @Html.TextBoxFor(lambda, new { disabled = condition ? true : null }), но он все равно отображается, disabled=""когда disabledбыл null, что аналогично воспроизведению, disabled="anything"потому что disabledон активен, когда атрибут присутствует, независимо от значения. Нашел stackoverflow.com/q/7978137/11683 по теме, но есть ли в настоящее время способы лучше?
GSerg
1
Боковое примечание: атрибуты «data -...» не могут быть условными и отображать пустое значение даже для null ( stackoverflow.com/questions/13267619/… )
Алексей Левенков
76 
<li class="@(ViewBag.pagename == "Business details" ? "active" : null)">

Вы должны заменить inline style="..."отдельным именем класса и использовать там тот же синтаксис.

Однако было бы проще создать отдельный вспомогательный метод расширения HTML, который принимает имя страницы и действия и генерирует HTML в общем виде.

SLaks
источник
1
Хороший, намного чище, чем некоторые другие варианты (кроме варианта Razor 2.0).
ctrlplusb
21

Я использую небольшой вспомогательный метод, который условно добавляет атрибут, если значение не пустое, и, если определено, когда выражение логической функции оценивается как true:

public static MvcHtmlString Attr(this HtmlHelper helper, string name, string value, Func<bool> condition = null)
{
    if (string.IsNullOrEmpty(name) || string.IsNullOrEmpty(value))
    {
        return MvcHtmlString.Empty;
    }

    var render = condition != null ? condition() : true;

    return render ? 
        new MvcHtmlString(string.Format("{0}=\"{1}\"", name, HttpUtility.HtmlAttributeEncode(value))) : 
        MvcHtmlString.Empty;
}

После определения я могу использовать этот метод в представлениях Razor:

<li @(Html.Attr("class", "new", () => example.isNew))>
...
</li>

Приведенный выше код будет оказывать , <li class="new">...</li>если example.isNew == true, если не будет опускать весь classатрибут.

разморозить
источник
1
Очень элегантный способ сделать это. Но вместо Func<bool>лямбды я предпочту простой bool?параметр, потому что он проще:<li @Html.Attr("class", "new", example.isNew)>
T-moty
Мне нравится этот подход, потому что большая часть пользовательского JavaScript в моем приложении по-прежнему будет работать, когда имя атрибута все еще присутствует. По крайней мере, это не заставляет вас повторять один и тот же div из-за различий в атрибутах. Благодаря!
Бен Сьюардс,
0

Подход с использованием метода расширения TagWrap. Код для вашего вопроса будет выглядеть так:

@using (Html.TagWrap("li", condition ? new { @class = "active" } : null))
{
    var anchorAttrs = new Dictionary<string, object> { { "href", Url.Action("BusinessDetails", "Business") } };
    if(condition)
    {
        anchorAttrs["style"] = "color: white; background-color: #08C; border: 1px solid #08C;";
    }
    using (Html.TagWrap("a", anchorAttrs))
    {
        <text>Business Details</text>
    }
}

Методы расширения TagWrap

используя Microsoft.AspNetCore.Mvc.ViewFeatures;

public static IDisposable TagWrap(this IHtmlHelper htmlHelper, string tagName, object data)
{
    return htmlHelper.TagWrap(tagName, HtmlHelper.AnonymousObjectToHtmlAttributes(data));
}

public static IDisposable TagWrap(this IHtmlHelper htmlHelper, string tagName, IDictionary<string, object> data)
{
    var tag = new TagBuilder(tagName);
    tag.MergeAttributes(data);

    htmlHelper.ViewContext.Writer.Write(tag.RenderStartTag());

    return new DisposableAction(() =>
        htmlHelper.ViewContext.Writer.Write(tag.RenderEndTag()));
}

Вспомогательный класс, используемый для отображения закрывающего тега в Dispose

public class DisposableAction : IDisposable
{
    private readonly Action DisposeAction;

    public DisposableAction(Action action)
    {
        DisposeAction = action;
    }

    public void Dispose()
    {
        DisposeAction();
    }
}
Павел Нейман
источник
0

На основе размораживания ответьте здесь на адаптацию, взяв objectвместо string:

    public static MvcHtmlString ConditionalAttr(this HtmlHelper helper, string attributeName, object value, Func<bool> condition)
    {
        if (string.IsNullOrEmpty(attributeName) || value == null)
        {
            return MvcHtmlString.Empty;
        }

        var render = condition != null ? condition() : true;

        return render ? 
            new MvcHtmlString($"{attributeName}=\"{HttpUtility.HtmlAttributeEncode(value.ToString())}\"") : 
            MvcHtmlString.Empty;
    }

Таким образом, вам не нужно превращать другие типы данных в строки перед их передачей, что экономит время .ToString(). Есть разница : передача пустой строки все равно будет отображаться. Например:

@Html.ConditionalAttr("data-foo", "", () => Model.IsFooNeeded)

// Ouput:
data-foo=""
Spaark
источник
0 
@{ var classAttr= needClass ? "class=\"class-name\"" : "" }

а затем в HTML

<li @Html.Raw(classAttr) >
user4649102
источник