ng-select

ng-select is a great option for building a customizable select component in your Angular application.

Install from NPM

Install the ng-select library from the command prompt in the root directory of the project:

                        yarn add @ng-select/ng-select --save
                    

Import the ng-select module in your Angular module:

                        import { NgSelectModule } from '@ng-select/ng-select';
                    

Make sure to add it to the imports array:

                        imports: [
NgSelectModule,
// other modules
]
                    

Below is an example of how to use ng-select in a component template:

HTML

                        <ng-select 
[items]="options" 
bindLabel="label" 
bindValue="value" 
placeholder="Select an option" 
[(ngModel)]="selectedOption">
</ng-select>
                    

TypeScript

                        import { Component } from '@angular/core';
            
@Component({
    selector: 'app-your-component',
    templateUrl: './your-component.component.html'
})
export class YourComponent {
    options = [
        { value: 1, label: 'Option 1' },
        { value: 2, label: 'Option 2' },
        { value: 3, label: 'Option 3' },
    ];
    selectedOption: number;
}
                    

For more customization options, you can refer to the official documentation.