Primeng-Angular2 - выпадающее из p-dataTable имеет проблему с дизайном

Question

Я использую primeng datatable и применяю выпадающее меню. Все работает правильно, за исключением случаев, когда выпадающее меню заполнено. Я не могу открыть раскрывающийся список с помощью мыши, но я могу изменить выбранный элемент с помощью клавиатуры. Я добавил изображение из своего интерфейса.

<p-dataTable [value]="sites" [(selection)]="selectedSites" (onRowSelect)="onRowSelect($event)" (onRowUnselect)="onRowUnselect($event)"> 
      <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column> 
      <p-column field="siteName" header="{{'SITE_FORM.SITENAME' | translate}}" sortable="true"></p-column> 
      <p-column field="clientName" header="{{'SITE_FORM.CLIENTNAME' | translate}}" sortable="true"></p-column> 
      <p-column header= "{{ 'ROLE_FORM.NAME' | translate }}"> 
       <template let-site="rowData" pTemplate type="body"> 
        <p-dropdown [style]="{'width':'100%'}" [options]="site.rolesSelectItem" [(ngModel)]="site.selectedRole"></p-dropdown> 
       </template>     
      </p-column> 
</p-dataTable> 

UI result in my local machine

Answer 1

Try;

<p-dropdown appendTo="body" 

Answer 2

Решение:

Я добавил тему с сайта ngPrime и он работает сейчас, но это переопределение собственной темы, и я не уверен, если я просто взять стиль из выпадающего списка меню и добавить его в наш style.less