Как я могу предотвратить использование Spring Security с Thymeleaf от нарушения форматирования CSS? - PullRequest
Новая
       16

Как я могу предотвратить использование Spring Security с Thymeleaf от нарушения форматирования CSS?

0 голосов
/ 26 октября 2018

Я использую Thymeleaf и Spring Security.У меня есть выпадающее меню с элементами списка.К сожалению, поскольку интеграция Thymeleaf + Spring Sec использует div, как вы видите ниже, это означает, что теперь у нас есть ul с div внутри и li внутри.Это нарушает форматирование css из bootsrap и меньше, чем ожидается ul> li.Другими словами, предполагается, что li является прямым потомком раскрывающегося списка ul, но в моем случае это не так из-за sec: authorize div.Вот эти зависимости css: picture. 

<ul class="dropdown-menu text-left">
    <li>
        <a role="button" class="a-primary btn-xs" data-bind="click: $parent.view"><span class="fa fa-search"></span> View</a>
    </li>
    <div sec:authorize access="hasAnyRole('A_ROLE', 'ANOTHER_ROLE')">
        <li>
            <a role="button" class="a-primary btn-xs" data-bind="visible: permissions().contains('Edit'), click: $parent.edit"><span class="fa fa-pencil"></span> Edit</a>
        </li>
        (more <li> elements in here)
    </div>
</ul>

Так что первый li отображается правильно, но li внутри div sec: authorize не форматируется правильно.

Как я могу заставить корректно отображать внутренние элементы li без редактирования файлов .css, от которых я зависим?Спасибо.

Ответы [ 2 ]

0 голосов
/ 26 октября 2018

Вам не нужно добавлять свою авторизацию в div. Вместо этого вы можете использовать th:block, что не создаст никакого дополнительного элемента. 

<th:block sec:authorize="hasAnyRole('A_ROLE', 'ANOTHER_ROLE')">
    <li>
        <a role="button" class="a-primary btn-xs" data-bind="visible: permissions().contains('Edit'), click: $parent.edit"><span class="fa fa-pencil"></span> Edit</a>
    </li>
</th:block>
0 голосов
/ 26 октября 2018

Я решил просто удалить этот внешний div и вместо этого поставить sec: authorize на каждый li. Это сохраняет структуру «dropdown-menu> li», которую ожидают эти зависимости .css. С другой стороны, это означает, что я должен поставить один и тот же sec: authorize access = "hasAnyRole ('A_ROLE', 'ANOTHER_ROLE')" на несколько li. Тем не менее, это работает.

Редактировать : Неважно, использовал решение, отмеченное выше.

...