Показать nb-datepicker в ng-sidebar

Question

Мне нужно показать nb-datepicker в ng-sidebar на веб-портале на основе Angular 6.Основная проблема заключается в том, что я не могу изменить CSS для ng-sidebar (по умолчанию z-index равен 99999999), и поэтому всплывающее окно для средства выбора даты скрывается за боковой панелью (z-index для контейнера средства выбора даты равен 1000).

Я попытался изменить / переопределить CSS напрямую.Когда я проверяю элементы, я вижу элемент «aside» в «ng-sidebar».Элемент 'aside' имеет следующий CSS:

.ng-sidebar[_ngcontent-c17] {
    -webkit-overflow-scrolling: touch;
    overflow: auto;
    pointer-events: auto;
    position: absolute;
    touch-action: auto;
    will-change: initial;
    z-index: 99999999;
}

Изменение z-index на 999 выводит DatePicker на передний план, но я не могу применить этот стиль из моего файла component.scss.

Нужна помощь с этим.Я пробовал:

:host ::ng-deep aside{
      z-index: 999;
}

и

.ng-sidebar[_ngcontent-c17]{
      z-index: 999;
}

и многие другие комбинации, но ничего не решило проблему.Пожалуйста, помогите.

Answer 1

пожалуйста, попробуйте этот код в вашем CSS или CSS файле

 ng-sidebar-container {
    z-index: 100;
 }

Answer 2

Использование :: ng-deep как

::ng-deep .ng-sidebar[_ngcontent-c17] {
    -webkit-overflow-scrolling: touch;
    overflow: auto;
    pointer-events: auto;
    position: absolute;
    touch-action: auto;
    will-change: initial;
    z-index: 999;
}