css - Angular 2:如何限制ng2-completer中的搜索结果数量？

在我的应用程序中使用ng2-completer时，当我们开始输入内容时，它将进行api调用，并且它将从服务器中正常获取记录。问题是，如果完成程序获得的条目超过50个，那么它会覆盖整个屏幕，我如何限制下拉列表的长度？我尝试了以下CSS，但无法正常工作。

.completer-dropdown {
   overflow-y: auto !important;
   max-height: 100px !important;
 }

这是我的html代码。

<ng2-completer  placeholder="Enter Your Locality Name" class="overlay" [dataService]="dataServiceForLocality" [minSearchLength]="3" [fieldTabindex]="2" [(ngModel)]="localityValue" (selected)="selectedLocality($event)" [textSearching]="'Please wait...'" formControlName="locality" style="height: 50px;" (keyup)="onKey($event.target.value)"></ng2-completer>

您可以查看实时示例here。

最佳答案

我认为ng2-completer目前不支持此功能。

但是无论如何，即使ng2-completer支持该功能，您的数据服务应该是负责最大项目数的数据服务。因此，仅返回找到的前10-20个项目，您就不想返回客户整个数据集。如果找到数千甚至更多的物品怎么办？

他知道，如果用户看到许多项目，则必须更精确地指定搜索。

编辑:刚刚检查了CSS类，您已经关闭了。.对我来说，这直接在演示页中起作用..更改了页面样式，如下所示:

.completer-dropdown[_ngcontent-tsn-1] {
    max-height: 200px !important;
    overflow-y: scroll;
    overflow-x: hidden;
    ...
}

参见下图:

关于css - Angular 2:如何限制ng2-completer中的搜索结果数量？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40903541/