1.0.7 • Published 4 years ago

ngx-angular-autocomplete v1.0.7

Weekly downloads
129
License
MIT
Repository
-
Last release
4 years ago

Ngx-Angular-Autocomplete

Simple Angular Autocomplete Component

Stackblitz Demo

Getting Started

Installation

Step 1 : npm install ngx-angular-autocomplete

API

Step 2 : Import the NgxAutocompleteModule:

import { NgxAutocompleteModule } from 'ngx-autocomplete' 
  @NgModule({
    declarations: [AppComponent],
    imports: [NgxAutocompleteModule],
    bootstrap: [AppComponent]
 })
export class AppModule {} 

Selector: ngx-autocomplete

Step 3 : In app.component.html

<ngx-autocomplete [searchKeyword]="'name'" 
    [inputId]="'searchEmployee'" 
    [placeholderValue]="'Enter the Employee Name'" 
    [entries]="employees" 
    (selectedValue)="selectEvent($event)">
</ngx-autocomplete>

In app.component.ts

import { Component } from '@angular/core';
    @Component({
        selector: 'app-root',
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css']
    })
    export class AppComponent {
        title = 'ngx-autocomplete-test';
        public employees = [
        {
          "id": 1,
          "name": "Parsifal",
          "gender": "Male"
        }, {
          "id": 2,
          "name": "Mirabel",
          "gender": "Female"
        }, {
          "id": 3,
          "name": "Verne",
          "gender": "Male"
        }, {
          "id": 4,
          "name": "Julissa",
          "gender": "Female"
        }, {
          "id": 5,
          "name": "Chaddy",
          "gender": "Male"
        }, {
          "id": 6,
          "name": "Cosme",
          "gender": "Male"
        }]
      selectEvent(event) {
        console.log(event)
     }}

API

@Input()

InputTypeRequiredDescription
searchKeywordstringtrueVariable name on which the search is to be performed
inputIdstringtrueset the id of input box
placeholderValuestringfalseinput box placeholder
entries array of objectstrueArray of Objects on which the search is to be performed

@Output()

OutputReturnDescription
( selectedValue )stringtrue

Author

1.0.7

4 years ago

1.0.6

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago

0.0.0

4 years ago