How to clear ng-select selection

Clearing the selection can be achieved by simply setting the ngModel value to null. In the case of the above example:

this.selectedCalculation = null;

This isn't exactly the same as clicking the clear icon, as it doesn't trigger the (clear) output event, but it was sufficient for my needs.

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.

Even thought @Buczkowski answer clears ng-select, it also does a focus on input, which isn't needed for all cases. So i used other method: clearModel

  // Access ng-select
  @ViewChild(NgSelectComponent) ngSelectComponent: NgSelectComponent;

  // Call to clear
  this.ngSelectComponent.clearModel();

So if you need to just clear input, use clearModel method. Else if focus and clear is needed, use handleClearClick.

I was looking for the same but for templates to invoke it outside ng-select. So, the below worked fine for me following the accepted answer. ^_^

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

<input type="button" (click)="selectDropdown.handleClearClick()">

This also makes sure the resetCalculations() being called.