Блог

Изображение формы:

В настоящее ng-select время отображается только 5 элементов. Я хочу увеличить высоту выпадающего списка, чтобы он мог отображать 8-10 элементов. Я использую приведенный ниже код:

 <form [formGroup]="addReportForm" class="form-horizontal col-xs-12" method="post" novalidate="novalidate" style="width: 100%;">
  <div class="form-group">
    <label for="adb-name">Name</label>
    <input  id="adb-name" class="form-control text-16-normal" type="text" placeholder="Name" formControlName="name">
  </div>
  <div class="form-group">
    <label for="adb-report">Type</label>
    <ng-select
      id="adb-report"
      [items]="allReports"
      [multiple]="false"
      [closeOnSelect]="true"
      [searchable]="true"
      bindLabel="name"
      bindValue="id"
      formControlName="vizType"
      placeholder="Select Report"
      (change)="onChange($event)"
      [(ngModel)]="reportName"
    >
    </ng-select>
  </div>
  <app-alert></app-alert>
</form>
 

Вы должны использовать /deep/ more компонент, который вы хотите изменить.

 /deep/ .ng-dropdown-panel .ng-dropdown-panel-items {
max-height: 500px;   }
 

Вы можете увеличить высоту с помощью css :

 .ng-dropdown-panel .ng-dropdown-panel-items {
    max-height: 500px !important;
}
 

max-height по умолчанию ng-select для 240px