ng2-completer
- Version 9.0.1
- Published
- 902 kB
- No dependencies
- MIT license
Install
npm i ng2-completer
yarn add ng2-completer
pnpm add ng2-completer
Overview
angular autocomplete/typeahead component
Index
Classes
CompleterCmp
- autofocus
- autoHighlight
- autoMatch
- blur()
- blurEvent
- clearSelected
- clearUnselected
- click
- close()
- completer
- control
- ctrInput
- dataService
- disableInput
- displayNoResults
- displaySearching
- fieldTabindex
- fillHighlighted
- focus()
- focusEvent
- highlighted
- initialValue
- inputClass
- inputId
- inputName
- isOpen()
- keydown
- keyup
- matchClass
- maxChars
- minSearchLength
- ngAfterViewChecked()
- ngAfterViewInit()
- onBlur()
- onChange()
- onClick()
- onFocus()
- onKeydown()
- onKeyup()
- onTouched()
- open()
- opened
- openOnClick
- openOnFocus
- overrideSuggested
- pause
- placeholder
- registerOnChange()
- registerOnTouched()
- searchStr
- selected
- selectOnClick
- selectOnFocus
- setDisabledState()
- value
- writeValue()
Interfaces
Classes
class CompleterCmp
class CompleterCmp implements ControlValueAccessor, AfterViewChecked, AfterViewInit {}
constructor
constructor(completerService: CompleterService, cdr: ChangeDetectorRef);
property autofocus
autofocus: boolean;
property autoHighlight
autoHighlight: boolean;
property autoMatch
autoMatch: boolean;
property blurEvent
blurEvent: EventEmitter<void>;
property clearSelected
clearSelected: boolean;
property clearUnselected
clearUnselected: boolean;
property click
click: EventEmitter<void>;
property completer
completer: CtrCompleter;
property control
control: FormControl;
property ctrInput
ctrInput: any;
property dataService
dataService: CompleterData;
property disableInput
disableInput: boolean;
property displayNoResults
displayNoResults: boolean;
property displaySearching
displaySearching: boolean;
property fieldTabindex
fieldTabindex: number;
property fillHighlighted
fillHighlighted: boolean;
property focusEvent
focusEvent: EventEmitter<void>;
property highlighted
highlighted: EventEmitter<CompleterItem>;
property initialValue
initialValue: any;
property inputClass
inputClass: string;
property inputId
inputId: string;
property inputName
inputName: string;
property keydown
keydown: EventEmitter<any>;
property keyup
keyup: EventEmitter<any>;
property matchClass
matchClass: string;
property maxChars
maxChars: number;
property minSearchLength
minSearchLength: number;
property opened
opened: EventEmitter<boolean>;
property openOnClick
openOnClick: boolean;
property openOnFocus
openOnFocus: boolean;
property overrideSuggested
overrideSuggested: boolean;
property pause
pause: number;
property placeholder
placeholder: string;
property searchStr
searchStr: string;
property selected
selected: EventEmitter<CompleterItem>;
property selectOnClick
selectOnClick: boolean;
property selectOnFocus
selectOnFocus: boolean;
property value
value: any;
method blur
blur: () => void;
method close
close: () => void;
method focus
focus: () => void;
method isOpen
isOpen: () => boolean;
method ngAfterViewChecked
ngAfterViewChecked: () => void;
method ngAfterViewInit
ngAfterViewInit: () => void;
method onBlur
onBlur: () => void;
method onChange
onChange: (value: string) => void;
method onClick
onClick: (event: any) => void;
method onFocus
onFocus: () => void;
method onKeydown
onKeydown: (event: any) => void;
method onKeyup
onKeyup: (event: any) => void;
method onTouched
onTouched: () => void;
method open
open: () => void;
method registerOnChange
registerOnChange: (fn: any) => void;
method registerOnTouched
registerOnTouched: (fn: any) => void;
method setDisabledState
setDisabledState: (isDisabled: boolean) => void;
method writeValue
writeValue: (value: any) => void;
class CompleterListItemCmp
class CompleterListItemCmp implements OnInit {}
class CompleterService
class CompleterService {}
constructor
constructor( localDataFactory: LocalDataFactory, remoteDataFactory: RemoteDataFactory);
method local
local: ( data: any[] | Observable<any>, searchFields?: string | null, titleField?: string | null) => LocalData;
method remote
remote: ( url: string | null, searchFields?: string | null, titleField?: string | null) => RemoteData;
class CtrCompleter
class CtrCompleter {}
property autoHighlightIndex
autoHighlightIndex: number;
property dataSourceChange
dataSourceChange: EventEmitter<void>;
property hasSelected
readonly hasSelected: boolean;
property highlighted
highlighted: EventEmitter<CompleterItem>;
property isOpen
isOpen: boolean;
property opened
opened: EventEmitter<boolean>;
property selected
selected: EventEmitter<CompleterItem>;
method cancelBlur
cancelBlur: (cancel: boolean) => void;
method clear
clear: () => void;
method hasHighlighted
hasHighlighted: () => boolean;
method isCancelBlur
isCancelBlur: () => boolean;
method nextRow
nextRow: () => void;
method onDataSourceChange
onDataSourceChange: () => void;
method onHighlighted
onHighlighted: (item: CompleterItem | null) => void;
method onSelected
onSelected: (item: CompleterItem | null, clearList?: boolean) => void;
method open
open: () => void;
method prevRow
prevRow: () => void;
method registerDropdown
registerDropdown: (dropdown: CompleterDropdown | null) => void;
method registerList
registerList: (list: CompleterList) => void;
method search
search: (term: string) => void;
method selectCurrent
selectCurrent: () => void;
class CtrDropdown
class CtrDropdown implements CompleterDropdown, OnDestroy, AfterViewInit {}
constructor
constructor(completer: CtrCompleter, el: ElementRef, zone: NgZone);
method clear
clear: () => void;
method highlightRow
highlightRow: (index: number | null) => void;
method nextRow
nextRow: () => void;
method ngAfterViewInit
ngAfterViewInit: () => void;
method ngOnDestroy
ngOnDestroy: () => void;
method onMouseDown
onMouseDown: (event: any) => void;
method onSelected
onSelected: (item: CompleterItem | null) => void;
method prevRow
prevRow: () => void;
method registerRow
registerRow: (row: CtrRowItem) => void;
method rowMouseDown
rowMouseDown: () => void;
method selectCurrent
selectCurrent: () => void;
method unregisterRow
unregisterRow: (rowIndex: number) => void;
class CtrInput
class CtrInput {}
constructor
constructor(completer: CtrCompleter, ngModel: NgModel, el: ElementRef);
property clearSelected
clearSelected: boolean;
property clearUnselected
clearUnselected: boolean;
property fillHighlighted
fillHighlighted: boolean;
property ngModelChange
ngModelChange: EventEmitter<any>;
property openOnClick
openOnClick: boolean;
property openOnFocus
openOnFocus: boolean;
property overrideSuggested
overrideSuggested: boolean;
property searchStr
searchStr: string;
property selectOnClick
selectOnClick: boolean;
property selectOnFocus
selectOnFocus: boolean;
method keydownHandler
keydownHandler: (event: any) => void;
method keyupHandler
keyupHandler: (event: any) => void;
method onBlur
onBlur: (event: any) => void;
method onClick
onClick: (event: any) => void;
method onfocus
onfocus: () => void;
method pasteHandler
pasteHandler: (event: any) => void;
class CtrList
class CtrList implements OnInit, CompleterList {}
constructor
constructor( completer: CtrCompleter, templateRef: TemplateRef<CtrListContext>, viewContainer: ViewContainerRef, cd: ChangeDetectorRef, zone: NgZone);
property ctrListAutoHighlight
ctrListAutoHighlight: boolean;
property ctrListAutoMatch
ctrListAutoMatch: boolean;
property ctrListDisplaySearching
ctrListDisplaySearching: boolean;
property ctrListMinSearchLength
ctrListMinSearchLength: number;
property ctrListPause
ctrListPause: number;
method clear
clear: () => void;
method isOpen
isOpen: (open: boolean) => void;
method ngOnInit
ngOnInit: () => void;
method open
open: () => void;
method search
search: (term: string) => void;
class CtrRow
class CtrRow implements CtrRowElement, OnDestroy {}
constructor
constructor(el: ElementRef, renderer: Renderer2, dropdown: CtrDropdown);
method getDataItem
getDataItem: () => CompleterItem | null;
method getNativeElement
getNativeElement: () => any;
method ngOnDestroy
ngOnDestroy: () => void;
method onClick
onClick: (event: any) => void;
method onMouseDown
onMouseDown: (event: any) => void;
method onMouseEnter
onMouseEnter: (event: any) => void;
method setHighlighted
setHighlighted: (selected: boolean) => void;
class LocalData
class LocalData extends CompleterBaseData {}
constructor
constructor();
property dataSourceChange
dataSourceChange: EventEmitter<void>;
property savedTerm
protected savedTerm: string;
method convertToItem
convertToItem: (data: any) => CompleterItem | null;
method data
data: (data: any[] | Observable<any[]>) => this;
method search
search: (term: string) => void;
class LocalDataFactory
class LocalDataFactory {}
method create
create: () => LocalData;
class Ng2CompleterModule
class Ng2CompleterModule {}
class ɵa
class CtrListContext {}
constructor
constructor( results: CompleterItem[], searching: boolean, searchInitialized: boolean, isOpen: boolean);
property isOpen
isOpen: boolean;
property results
results: CompleterItem[];
property searching
searching: boolean;
property searchInitialized
searchInitialized: boolean;
class ɵb
abstract class CompleterBaseData extends Subject<CompleterItem[] | null> implements CompleterData {}
constructor
constructor();
method cancel
cancel: () => void;
method convertToItem
convertToItem: (data: any) => CompleterItem | null;
method descriptionField
descriptionField: (descriptionField: string) => this;
method extractMatches
protected extractMatches: (data: any[], term: string) => any[];
method extractTitle
protected extractTitle: (item: any) => any;
method extractValue
protected extractValue: (obj: any, key: string | null) => any;
method imageField
imageField: (imageField: string) => this;
method processResults
protected processResults: (matches: string[]) => CompleterItem[];
method search
abstract search: (term: string) => void;
method searchFields
searchFields: (searchFields: string | null) => this;
method titleField
titleField: (titleField: string | null) => this;
class RemoteData
class RemoteData extends CompleterBaseData {}
constructor
constructor(http: HttpClient);
property dataSourceChange
dataSourceChange: EventEmitter<void>;
method cancel
cancel: () => void;
method convertToItem
convertToItem: (data: any) => CompleterItem | null;
method dataField
dataField: (dataField: string) => void;
method remoteUrl
remoteUrl: (remoteUrl: string | null) => this;
method requestOptions
requestOptions: (requestOptions: any) => void;
method search
search: (term: string) => void;
method urlFormater
urlFormater: (urlFormater: (term: string) => string) => void;
class RemoteDataFactory
class RemoteDataFactory {}
constructor
constructor(http: HttpClient);
method create
create: () => RemoteData;
Interfaces
interface CompleterData
interface CompleterData extends Observable<CompleterItem[] | null> {}
property dataSourceChange
dataSourceChange?: EventEmitter<void>;
method cancel
cancel: () => void;
method convertToItem
convertToItem: (data: any) => CompleterItem | null;
method search
search: (term: string) => void;
interface CompleterItem
interface CompleterItem {}
property description
description?: string;
property image
image?: string;
property originalObject
originalObject: any;
property title
title: string;
Package Files (17)
- ng2-completer.d.ts
- src/components/completer-cmp.d.ts
- src/components/completer-item.d.ts
- src/components/completer-list-item-cmp.d.ts
- src/directives/ctr-completer.d.ts
- src/directives/ctr-dropdown.d.ts
- src/directives/ctr-input.d.ts
- src/directives/ctr-list.d.ts
- src/directives/ctr-row.d.ts
- src/modules/ng2-completer.module.d.ts
- src/services/completer-base-data.d.ts
- src/services/completer-data.d.ts
- src/services/completer-service.d.ts
- src/services/local-data-factory.d.ts
- src/services/local-data.d.ts
- src/services/remote-data-factory.d.ts
- src/services/remote-data.d.ts
Dependencies (0)
No dependencies.
Dev Dependencies (56)
- @angular/animations
- @angular/cdk
- @angular/common
- @angular/compiler
- @angular/compiler-cli
- @angular/core
- @angular/forms
- @angular/material
- @angular/platform-browser
- @angular/platform-browser-dynamic
- @angular/platform-server
- @angular/router
- @compodoc/compodoc
- @rollup/plugin-node-resolve
- @types/jasmine
- @types/node
- angular2-template-loader
- awesome-typescript-loader
- chalk
- codelyzer
- copy-webpack-plugin
- core-js
- cross-env
- extract-text-webpack-plugin
- gh-pages
- html-loader
- html-webpack-plugin
- istanbul-instrumenter-loader
- jasmine-core
- karma
- karma-chrome-launcher
- karma-coverage-istanbul-reporter
- karma-jasmine
- karma-sourcemap-loader
- karma-spec-reporter
- karma-webpack
- ngx-bootstrap
- raw-loader
- reflect-metadata
- rollup
- rollup-plugin-license
- rollup-plugin-sourcemaps
- rollup-plugin-visualizer
- rxjs
- shelljs
- source-map-loader
- to-string-loader
- ts-loader
- tslint
- typescript
- uglify-js
- webpack
- webpack-cli
- webpack-dev-server
- webpack-merge
- zone.js
Peer Dependencies (3)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/ng2-completer
.
- Markdown[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/ng2-completer)
- HTML<a href="https://www.jsdocs.io/package/ng2-completer"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 6229 ms. - Missing or incorrect documentation? Open an issue for this package.