时间戳

首页 > 解决方案 > 如何在多选primeng angular中添加清除按钮以进行过滤

angular - 如何在多选primeng angular中添加清除按钮以进行过滤

问题描述

我正在尝试使用过滤器进行多选。我需要在过滤后清除过滤器（不是选择）。我使用了prime ng multiselect，它没有满足这个要求的属性。

下面是我的代码。

<p-multiSelect 
  [options]="subjectTitles" 
  [showToggleAll]="false" 
  [(ngModel)]="selectedTitle 
  [ngModelOptions]="{ standalone: true }" 
  optionLabel="title" 
  defaultLabel="Select title"  
  [filter]="true 
  [itemSize]="30" 
  filterPlaceHolder="Search title" 
  #select="ngModel" 
  required 
  (onPanelHide)="panelClosed = true" 
  class="multiselect-custom-virtual-scroll" >
</p-multiSelect>`

我可以知道是否有人对此有解决方案吗？

标签： angularprimengmulti-select

解决方案

p-multiselect 的 onPanelShow 事件，将多选过滤器输入的类型设置为“搜索”。

(onPanelShow)="onMsPanelShow()"

onMsPanelShow()
{
    if(document.getElementsByClassName(
    "p-multiselect-filter p-inputtext p-component"
    )){
        document.getElementsByClassName(
        "p-multiselect-filter p-inputtext p-component"
        ).item(0).setAttribute("type","search");
    }
}

PS 它可能不适用于 IE 浏览器。

推荐阅读