@malekp/ng-dropdown

Simple component for Angular 2 to use custom dropdown menu

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@malekp/ng-dropdown
0.1.84 years ago4 years agoMinified + gzip package size for @malekp/ng-dropdown in KB

Readme

Simple angular 2 dropdown component
Use this component to create a custom drop-down list on your page.
Install
$ npm install @malekp/ng-dropdown
Usage
app.module.ts
@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    DropdownModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
app.component.html
<ng-dropdown [items]="Items" [(model)]="Selected" [config]="{ groupBy: Group, searchBy: Filter, templateBy: Template }">
    <ng-template templateName="super" let-item>{{ item.Title }}</ng-template>
</ng-dropdown>
app.component.ts
public Template(item: any): string {
  return 'super';
}

public Group(item: any): string {
  return item.Title[0] % 2 === 0 ? 'Event' : 'Odd';
}

public Filter(item: any, expr: string): boolean {
  return expr ? item.Title.toLowerCase().includes(expr.toLowerCase()) : true;
}