typescript - ฉันจะตัดช่องว่างในตัวกรอง Dropdown (p-dropdown) ของ primeNg ใน angular 5 ได้อย่างไร?
ฉันได้ใช้ primeNg dropdown (p-dropdown) ในโปรเจกต์ Angular 5 ของฉัน แต่เมื่อฉันพยายามกรองข้อมูล dropdown และฉันใส่ช่องว่าง หลังจากนั้น dropdown จะแสดง ไม่พบผลลัพธ์ ดังนั้นฉันจะแก้ปัญหานี้ได้อย่างไร?
เช่น ฉันมีเมนูแบบเลื่อนลงสำหรับประเทศ และถ้าฉันค้นหาอินเดียโดยมีช่องว่างก่อนและหลังในตัวกรอง p-dropdown จะแสดงข้อความ ไม่พบผลลัพธ์
ฉันแค่ต้องการตัดเว้นวรรค() ของสตริงที่ค้นหาในตัวกรอง primeng p-dropdown
นี่คือรหัส HTML ของ p-dropdown:
<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>
คำตอบ #1
ฉันได้พบวิธีแก้ปัญหาแล้ว แต่เป็นวิธีที่ซับซ้อน สิ่งพื้นฐานที่นี่คือเมื่อเราใช้ <p-dropdown> ในแอป Angular ของเราพร้อมกับ [filter]="true" มันจะมีเมธอด keydown สำหรับการกรองที่ถูกกำหนดไว้ใน ng_modules->primeng->components->dropdown->dropdown.js ดังนั้นเพื่อการตัดค่าที่ค้นหาหรือกรองจากด้านซ้ายและขวา เราจำเป็นต้องเพิ่ม .trim() ที่ inputValue แบบนี้: this.filterValue=inputValue.trim();
Primeng ควรเพิ่มสิ่งนี้ในโค้ดหลักของ dropdown ของพวกเขาเพื่อที่เราจะได้ไม่ต้องแก้ไขเพิ่มเติมและจะไม่เจอปัญหานี้อีกต่อไป
คำตอบ #2
ใน 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);
}
