如何显示 SearchFilter 文本框，即使 Angular Multiselect Dropdown 中没有加载数据

Question

Angular version : 8

ng-multiselect-dropdown version: ^0.2.10

In my case, User to be able to start typing in the search field to dynamically load results into the dropdown. But In ng-multiselect-dropdown searchbox to be visible at least one row of data is required. Is there any way to show the search filter always,regardless of whether data is available.

this.dropdownList = [];

  this.dropdownSettings= {
  singleSelection: false,
  idField: 'item_id',
  textField: 'item_text',
  selectAllText: 'Select All',
  unSelectAllText: 'UnSelect All',
  itemsShowLimit: 3,
  allowSearchFilter: true
};

enter image description here

Answer 1

I am late to answer, but this can be useful if someone gets the same question again. Add allowRemoteDataSearch:true to your dropdown options.

You can refer this thread

https://github.com/NileshPatel17/ng-multiselect-dropdown/issues/182

Answer 2

I would have placed an entry 'no data available' when there are no result and remove when it is not necessary. Do you think you already use this: onFilterChange ?

dropdownList = [];

onFilterChange(data) => { // basic
    const defaultOption = {item_id: -1, item_text: ‘no data available’}
    if(this.dropdownList.length > 1) {
        this.dropdownList.shift();
        this.dropdownSetting.defaultOpen = false;
    } else {
        this.dropdownList.push(defaultOption);
        // leaving the drop down open
        this.dropdownSetting.defaultOpen = true;
    }
}

As me I would have finish the US using noDataAvailablePlaceholderText as mentioned in the doc. It may not work :)

hope it works for your version