Как отобразить подменю, когда в главном меню есть свиток? - PullRequest
0 голосов
/ 26 сентября 2019

Я борюсь с этой проблемой:

Я использую угловые 8 и tieredMenu от primeng 8.

Моя проблема, когда у меня есть свиток, подменю tieredMenu скрыто

Как ее решить?

это HTML-файл:

<div class="app-scroll-perso">
  <div class="scroll-width-perso">
    <p-tieredMenu [model]="items"></p-tieredMenu>
  </div>
</div>

Файл TypeScript:

items: MenuItem[];

ngOnInit() {
    this.items = [
        {
            label: 'File',
            icon: 'pi pi-fw pi-pencil'
        },
        {
            label: 'encouragment',
            icon: 'pi pi-briefcase'
        },
        {
            label: 'primeng',
            icon: 'pi pi-save'
        },
        {
            label: 'contact',
            icon: 'pi pi-cloud-upload'
        },
        {
            label: 'Edit',
            icon: 'pi pi-tags'
        },
        {
            label: 'user',
            icon: 'pi pi-user',
            items: [
                {label: 'Delete', icon: 'pi pi-fw pi-trash'},
                {label: 'Refresh', icon: 'pi pi-fw pi-refresh'},
                {label: 'save', icon: 'pi pi-fw pi-refresh'},
                {label: 'modify', icon: 'pi pi-fw pi-refresh'},
                {label: 'nothing', icon: 'pi pi-fw pi-refresh'}
            ]
        },
        {
            label: 'blog',
            icon: 'pi pi-fw pi-pencil'
        }
    ];
}

css для применения прокрутки:

.scroll-width-perso {
  max-height: 20vh;
  overflow-y: scroll;
  overflow-x: hidden;
  width: 180px;
}

Ниже вы можете найти пример того, что я сделал до сих пор:

https://stackblitz.com/edit/angular-3kxful

1 Ответ

0 голосов
/ 26 сентября 2019

try Укажите переполнение: отображается в css

.scroll-width-perso {
max-height: 0vh;
overflow-y: visible;
overflow-x: visible;
width: 180px;
}
...