angularangular-ngselect

How to clear ng-select selection


Is it possible to programmatically clear the selection of an ng-select dropdown? I'm wanting the equivalent behaviour of clicking the clear icon, but triggered programmatically.

Screenshot of ng-select dropdown, with clear icon circled in red

I was expecting a clear() method or something similar, but the documented API doesn't have anything along those lines.

This is my dropdown code:

<ng-select class="ng-select-wrap"
           [searchFn]="multiTermSearch"
           [items]="calculationOptions"
           placeholder="Please select..."
           name="calculation"
           #calculationValue="ngModel"
           [(ngModel)]="selectedCalculation">
</ng-select>


Solution

  • Here is solution from comment:

      // Access ng-select
      @ViewChild(NgSelectComponent) ngSelectComponent: NgSelectComponent;
    
      // Call to clear
      this.ngSelectComponent.handleClearClick();
    

    Note that handleClearClick isn't exposed in docs as public api method however as Tim mentioned it's public method so it's possible to call it.