如果找不到项目，Angular ng-select autocomplete 如何提供“创建新项目”的选项？

Question

In ng-select (Angular), is there a way to provide "Create New" if no matches in the data list based on user search?

I like to create new items like the reference image below when no matches are found.

As per ng select config, we have the option to set only text for not Found Text (notFoundText). I didn't have any HTML Template option to provide.

Any suggestions?

Ng-select Stackblitz - https://stackblitz.com/edit/ng-select-not-fount-text-not-working-5gcdlq?file=src%2Fbindings-default-example.component.ts,src%2Fbindings-default-example.component.html

Answer 1

We can pass a template like below.

<ng-select 
[items]="defaultBindingsList" 
[(ngModel)]="selectedCity"

>
<ng-template ng-notfound-tmp let-searchTerm="searchTerm">
<div class="ng-option disabled">
    No data found for "{{searchTerm}}". Do you want to create new?
    <button>Create New</button>
</div>
</ng-template>
</ng-select>

Answer 2

do you want somthing like this? https://stackblitz.com/edit/ng-select-not-fount-text-not-working-jesqxx?file=src%2Fbindings-default-example.component.ts,src%2Fbindings-default-example.component.html