我在我的 Angular 5 项目中使用了 primeNg 下拉列表(p-dropdown),但是当我尝试过滤下拉列表数据并且我在该下拉列表之后给出空间时,显示未找到结果,那么我该如何解决这个问题?
例如我有国家/地区下拉列表,如果我在过滤器 p-下拉列表中搜索前后有空格的印度,则显示 No Results Found 消息。
我只是想在 primeng p-下拉过滤器中修剪()搜索到的字符串
这是p-dropdown的html代码:
<p-dropdown (onChange)="checkType(model.transectionType)" *ngIf="availableBalance != 0.00" (keydown)="onKeyUp($event)" [style]="{'width':'100%'}" [options]="transectionType" [filter] = "true"
[resetFilterOnHide] = "true" [(ngModel)]="model.transectionType"
[formControl]="form.controls['transectionType']" placeholder="Select a Transaction type"
optionLabel="value"></p-dropdown>
我已经找到了解决方案,但它很复杂。 所以这里的基本事情是,当我们在 Angular 应用程序中使用
<p-dropdown>
和 [filter]="true"
时,它将具有在 ng_modules->primeng->components->dropdown->dropdown.js 中定义的过滤器的 keydown 方法,以便修剪搜索的内容/从左右过滤值,我们需要在 inputValue 处添加 .trim(),如下所示:this.filterValue = inputValue.trim();
Primeng 应该将其添加到下拉菜单的核心代码中,这样我们就不需要另外修复它,也不会进一步解决这个问题。
在primeng 15 和 Angular 15 中:
html 文件
<p-dropdown (onFilter)="onFilter($event)" [filterValue]="filterValue">
.ts 文件
filterValue: string = '';
onFilter(event) {
this.filterValue = '';
this.filterValue = CommonHelper.CorrectWrongCharacters(event.filter);
}