另一个列表弹出窗口的搜索字段不明确

Search field not clear for another list popup

我正在为 dxlist 弹出窗口使用 Devextreme 模块。我能够打开弹出窗口并显示带有搜索输入字段的项目列表,但我还有一个列表弹出窗口。当我在第一个弹出窗口中搜索并关闭它时,打开第二个弹出窗口,搜索字段文本没有被清除。

    <dx-popup class="popup popupMore" [width]="500" [height]="500" [showTitle]="true" title="{{popupdata.name}}" [dragEnabled]="false"
  [closeOnOutsideClick]="true" [(visible)]="isVisible">

  <div class="list-container">
    <dx-list #list [dataSource]="popupdata.data" [height]="400" [searchEnabled]="true" 
      searchMode="contains"  >
      <div *dxTemplate="let data of 'item'">
        <div>{{data}}</div>
      </div>
    </dx-list>
  </div>
</dx-popup>

以上代码用在了html。同样的弹出窗口将为另外两个事件打开。

示例: 我有三个按钮。当我们点击每个按钮时,我们需要打开具有不同数据的相同弹出窗口。当我们单击第一个按钮时,此列表弹出窗口将打开并带有搜索选项。我在搜索字段中搜索并关闭了弹出窗口。然后单击第二个按钮,同样的弹出窗口将打开新数据,但搜索输入字段未清除。

谁能帮我,如何清除打开的下一个列表弹出窗口的搜索字段?

提前致谢。

如上面的评论所述,我能想到的最聪明的方法是注册 dxPopuponShown 事件,当被触发时,您可以:

  • 重置 list.instance searchValue 选项(使用 this.list.instance.option('searchValue','');)。
  • dx-list 组件分配双向绑定值并重置该值。对于这种情况,具体来说,将 [(searchValue)]="_searchValue" 添加到 html dx-list 标记,并在 dxPopuponShown 回调中添加 this._searchValue = ''