Как добавить второй класс CSS с условным значением в бритве MVC 4

Хотя Microsoft создала автоматическую визуализацию атрибутов html В бритве MVC4 мне потребовалось довольно много времени, чтобы выяснить, как визуализировать второй класс css для элемента, основанного на выражении условной бритвы. Я хотел бы поделиться этим с вами.

На основе свойства модели @ Model.Details я хочу показать или скрыть элемент списка. Если есть детали, div должен быть показан, в противном случае он должен быть скрыт. Используя jQuery, все, что мне нужно сделать, это добавить класс show или hide соответственно. Для других целей я также хочу добавить еще один класс «детали». Итак, моя наценка должна быть:

<div class="details show">[Details]</div> или <div class="details hide">[Details]</div>

Ниже я показываю несколько неудачных попыток (полученная разметка при условии отсутствия подробностей).

Это: <div @(@Model.Details.Count > 0 ? "class=details show" : "class=details hide")>,

отобразит это: <div class="details" hide="">.

Это: <div @(@Model.Details.Count > 0 ? "class=\"details show\"" : "class=\"details hide\"")>.

отобразит это: <div class=""details" hide&quot;="">.

Это: <div @(@Model.Details.Count > 0 ? "class='details show'" : "class='details hide'")>

отобразит это: <div class="'details" hide&#39;="">.

Ни одна из них не является правильной разметкой.

119 голосов | спросил R. Schreurs 29 MarpmFri, 29 Mar 2013 13:40:29 +04002013-03-29T13:40:29+04:0001 2013, 13:40:29

4 ответа


0

Я считаю, что все еще может быть и действительная логика взглядов. Но для такого рода вещей я согласен с @BigMike, его лучше разместить на модели. Сказав, что проблема может быть решена тремя способами:

Ваш ответ (при условии, что это работает, я не пробовал этого):

<div class="details @(@Model.Details.Count > 0 ? "show" : "hide")">

Второй вариант:

@if (Model.Details.Count > 0) {
    <div class="details show">
}
else {
    <div class="details hide">
}

Третий вариант:

<div class="@("details " + (Model.Details.Count>0 ? "show" : "hide"))">
ответил von v. 29 MarpmFri, 29 Mar 2013 14:01:53 +04002013-03-29T14:01:53+04:0002 2013, 14:01:53
0

Это:

    <div class="details @(@Model.Details.Count > 0 ? "show" : "hide")">

отобразит это:

    <div class="details hide">

и это разметка, которую я хочу.

ответил R. Schreurs 29 MarpmFri, 29 Mar 2013 13:40:29 +04002013-03-29T13:40:29+04:0001 2013, 13:40:29
0

Вы можете добавить свойство к вашей модели следующим образом:

    public string DetailsClass { get { return Details.Count > 0 ? "show" : "hide" } }

и тогда ваше представление будет проще и совсем не будет содержать логику:

    <div class="details @Model.DetailsClass"/>

Это будет работать даже со многими классами и не будет отображать класс, если он нулевой:

    <div class="@Model.Class1 @Model.Class2"/>

с двумя не нулевыми свойствами будет отображать:

    <div class="class1 class2"/>

если class1 равен нулю

    <div class=" class2"/>
ответил syned 23 J000000Tuesday13 2013, 23:36:57
0

Вы можете использовать функцию String.Format для добавления второго класса в зависимости от условия:

<div class="@String.Format("details {0}", Details.Count > 0 ? "show" : "hide")">
ответил Chetan Gaonkar 13 22018vEurope/Moscow11bEurope/MoscowTue, 13 Nov 2018 16:18:26 +0300 2018, 16:18:26

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132