KendoOptimisedDropDownList

• A simple optimised kendo Drop Down List to be used with big set of data.
• This Dropdown List enhances the funtionality of Kendo Angular DropDownList kendo-dropdownlist component.It loads the next set of data when users reaches the end of scroll. This feature is also applicable for search.
• It is developed using Angular >=6.1.0 and its newly introduced ng g library schematics.
• Library location: projects/kendo-optimised-search directory of this repository.

Dependencies

"@progress/kendo-angular-dropdowns": "^4.2.3", "@progress/kendo-angular-l10n": "^2.0.0", "@progress/kendo-angular-popup": "^3.0.0", "@progress/kendo-theme-bootstrap": "^4.8.0", "@progress/kendo-theme-default": "latest"

Installation

npm i kendo-optimised-search

API

import { KendoOptimisedSearchModule } from 'kendo-optimised-search' selector: kendoOptimisedSearch

@Inputs()

| Input | Type | Required | Description | | ---------------- | ------- | -------------------------- | --------------------------------------------------------------------------------------------------------- | | apiUrl | string | YES | the url of a remote server that supports http/jsonp calls. | | account | number | YES | account number for which data is to be queried | | apiMethod | string | Optional, default: 'get' | the http/jsonp method to be used. | | apiType | string | Optional, default: 'http' | http or jsonp method types. | | noOfRows | number | Optional, default: 100 | No of records to be fetched after each api call |

@Outputs()

| Output | Type | Required | Description | | ---------------- | ---------- | -------- | ------------------------------------------------------ | | onselectionChange | object | YES | emits selected element

Usage

1. Register the KendoOptimisedSearchModule in your app module.

import { KendoOptimisedSearchModule } from 'kendo-optimised-search'

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { KendoOptimisedSearchModule } from 'kendo-optimised-search';



@NgModule({
 declarations: [
   AppComponent
 ],
 imports: [
   BrowserModule,
   DropDownsModule,
   BrowserAnimationsModule,
   KendoOptimisedSearchModule
 ],
 providers: [],
 bootstrap: [AppComponent]
})
export class AppModule { }