ngx-kc-selectbox

DEMO: https://kastriotcunaku.github.io/ngx-kc-selectbox/

Features

• Modern UI
• Easy to install and use
• Use your existing form elements, just wrap them with <ngx-selectbox> tag.
• Included search field

Dependencies

ngx-kc-selectbox	Angular
1.0.0	5.x

Install

npm install ngx-kc-selectbox --save

Setup

Add NgxSelectboxModule to app NgModule

import { CommonModule } from '@angular/common';
 
import { NgxSelectboxModule } from 'ngx-selectbox';
 
@NgModule({
  imports: [
    CommonModule,
    NgxSelectboxModule // NgxSelectboxModule added
  ],
  bootstrap: [App],
  declarations: [App]
})
class AppModule {}

Use

<ngx-selectbox [placeholder]="'Sort by'" [hideSearch]="true">
  <div class="items">
    <label class="custom-input">Name
      <input type="radio" name="sort" value="Name" [(ngModel)]="sort">
      <span class="checkmark"></span>
    </label>
    <label class="custom-input">Type
      <input type="radio" name="sort" value="Type" [(ngModel)]="sort">
      <span class="checkmark"></span>
    </label>
    <label class="custom-input">Size
      <input type="radio" name="sort" value="Size" [(ngModel)]="sort">
      <span class="checkmark"></span>
    </label>
  </div>
</ngx-selectbox>

More examples can be found here