Как показать выпадающий список поверх выпадающего списка (всегда)

Я использую пейджер Syncfusion, выпадающий список в нашем приложении, пожалуйста, откройте ссылку ниже.

https://stackblitz.com/edit/angular-nv6myv?file=src%2Fapp%2Fapp.component.html

данные будут меняться в зависимости от количества элементов, выбранных из раскрывающегося списка. выбрав из выпадающего списка 20 элементов, прокрутите страницу вниз. раскрывающийся список показывает нижнюю часть раскрывающегося списка. но я хочу, чтобы элементы выпадающего списка всегда были в верхней части выпадающего списка.

Пожалуйста, предоставьте любое решение.

2 ответа

Я только что увидел твой код по твоей ссылке, и я попробовал это:

    <div class="container-fluid">
    <div class="card" *ngFor="let student of tempArray">
    <div class='card-body'>
        <p class="text-truncate">{{student.name}} &nbsp; &nbsp; {{student.standard}}</p>    
    </div>    
    </div>
<br/><br/><br/><br/><br/>
  <div class='card'>
    <div class='card-body'>
      <div class="fixed-footer" *ngIf="students.length > paginationData[0].value">
<ejs-pager  [pageCount]="3" [pageSize]="value" (click)="selectedPage($event)"
 [totalRecordsCount]='students.length'></ejs-pager>
<ejs-dropdownlist [dataSource]="paginationData" [fields]="fields" (change)="valueChange($event)" [popupHeight]=150 [value]="value"></ejs-dropdownlist>
</div></div>
    </div>
</div>

то, что я сделал здесь, это то, что я поместил элементы списка и выпадающий список на отдельную карту.

это немного грязно, просто, пожалуйста, сделайте отступы.

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

onddlPopupOpen(event: PopupEventArgs, ddlObj) {
    event.popup.offsetY = -(parseInt(ddlObj.popupHeight));
    event.popup.collision = { X: 'fit', Y: 'fit' };
    event.popup.dataBind();
    event.popup.refreshPosition(ddlObj.element, false);
}

Это откроет всплывающее окно в верхней части.

Образец

Другие вопросы по тегам