ng-класс не применяется к заголовку гармошки

0

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

.overridden .panel-heading {
    background-color: red;
}

Когда я укажу это

<accordion-group ng-repeat="kvp in jobTemplate.jobMasterConfigGroups[$index].jobMasterConfigs" is-open="kvp.active" class="overridden">

Заголовок загорается красным цветом для всех строк, поэтому он выбирает класс. Однако, когда я это делаю

<accordion-group ng-repeat="kvp in jobTemplate.jobMasterConfigGroups[$index].jobMasterConfigs" is-open="kvp.active" ng-class="{'overridden': 1 == 1}">

Он не меняется. Я жестко запрограммировал выражение для 1 == 1, чтобы заставить истинную оценку только для тестирования (я буду использовать переменную позже), но даже не могу ее отобразить красным на жестко закодированной истинной оценке.

Любые идеи, почему это может произойти?

Обновление: я пробовал

 <accordion-group ng-repeat="kvp in jobTemplate.jobMasterConfigGroups[$index].jobMasterConfigs" is-open="kvp.active" ng-class="{'overridden': 1 == 1}">
                                        <accordion-heading ng-class="{'overridden': kvp.isOverridden}">
                                            <div ng-class="{'overridden': kvp.isOverridden}">
                                                <i class="fa" ng-class="{'fa-minus': kvp.active, 'fa-plus': !kvp.active}"></i>
                                                <span>Key: <strong>{{kvp.Key | cut:false:15}}</strong> Value: <strong>{{kvp.value | cut:false:50}}</strong></span>
                                            </div>
                                        </accordion-heading>

Это делает фон красным, но только фоном текста, а не дополнением и фоном всего фона аккордеона. Таким образом, я доказал, что мои работы kvp.isOverridden, также как и директива ng-class, однако я не могу заставить класс применяться к заголовку гармоник, поэтому я предполагаю, что у меня нет правильного CSS или я пытаюсь переопределить его на неправильном уровне. Кажется, что все материалы аккордеона находятся в bootstrap.css, возможно, есть другой стиль, который отменяет то, что я пытаюсь установить? Какой CSS и переопределить мне нужно, чтобы переопределить контроль заголовка аккордеона?

Обновление 2: следующее перекрывает фон для всех панелей на моем веб-сайте и работает, очевидно, что я хочу только переопределить его условно на этом блоке кода, но это подтверждает, что я применяю стили или не переопределяю значение по умолчанию это проблема

.panel-default >.panel-heading {
    background-color: #5bc0de;
}

1 ответ

0

Вы можете использовать директиву accordion-heading для предоставления настраиваемого класса для заголовка

<accordion-group ng-repeat="kvp in jobTemplate.jobMasterConfigGroups[$index].jobMasterConfigs" 
 is-open="kvp.active">
    <accordion-heading>
        <i ng-class="{'overridden': 1 === 1}"></i> My Heading
    </accordion-heading>
    This is just some content to illustrate fancy headings.
</accordion-group>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню