angular - 如果 ng-select 中列表为空，则隐藏选项列表

Question

如果列表为空，我需要隐藏 ng-select 的选项列表。现在，如果我单击选择框，或者搜索结果为空，则会显示带有此未找到项目值的选项列表。我不需要这个功能。相反，我需要隐藏选项列表。

<ng-select class="selectable_input" placeholder="PLZ / Ort" [searchable]="true" [searchFn]="customSearch" (search)="searchLocation($event.term)" (clear)="clearLocationList()" (change)="setLocation($event)" formControlName="location" required>

   <ng-option *ngIf="isLocationLoading else noLoader" [disabled]="true"><i class="fa fa-spinner fa-spin"></i> Loading...</ng-option>

       <ng-template #noLoader>

          <div *ngFor="let locations of locationList">
              <ng-option *ngFor="let location of locations" [value]="location">{{location?.zip}} {{location?.place}}
              </ng-option>
          </div>
        </ng-template>

    </ng-select>

Answer 1

您可以使用[isOpen] <ng-select> 内的属性标记以实现您的目标，如下所示:

[isOpen] = "!locationList.length? false : null"  

如果下拉列表中没有项目，这将阻止打开下拉列表。

另一个选项是使用适合您的应用程序的内容更改显示文本本身，甚至使用 notFoundText 将其设置为空字符串。 <ng-select> 内的属性