ngx-dadata

Angular 6+ Dadata suggestion (подсказки) implementation with Material Design

Getting Started

Demo

Demo is here demo

Working code for this demo at stackblitz example

Installation

Install via npm package manager

npm install @kolkov/ngx-dadata --save

Usage

Import ngx-dadata module

import { HttpClientModule } from '@angular/common/http';
...
import { NgxDadataModule } from '@kolkov/ngx-dadata';

@NgModule({
  imports: [ HttpClientModule, NgxDadataModule ]
})

Then in HTML

<ngx-dadata [config]="config" [(ngModel)]="currentAddress"></ngx-dadata>

or

<ngx-dadata formControlName="currentAddress" [config]="config" (selected)="onAddressSelected($event)"></ngx-dadata>

where

import { DadataConfig } from '@kolkov/ngx-dadata';

...

config: DadataConfig = {
    apiKey: 'your_api_key',
    type: DadataType.address
  };

onAddressSelected(event: DadataSuggestion) {
    const addressData = event.data as DadataAddress;
    console.log(addressData);
  }

For ngModel to work, you must import FormsModule from @angular/forms, or for formControlName, you must import ReactiveFormsModule from @angular/forms

also you may add additional options to constraint search (for example cities only):

import { DaDataConfig } from '@kolkov/ngx-dadata';
...
config: DaDataConfig = {
   apiKey: 'your_api_key',
   type: DaDataType.address,
   locations: [
       {
           region: 'Самарская',
           city: 'Тольятти',
       }        
   ]     
 };

What's included

Within the download you'll find the following directories and files. You'll see something like this:

dadata/
└── projects/
    ├── ngx-dadata/
    └── ngx-dadata-app/

ngx-dadata/ - library

ngx-dadata-app/ - demo application

Documentation

The documentation for the ngx-dadata is hosted at our website ngx-dadata

Contributing

Please read through our contributing guidelines. Included are directions for opening issues, coding standards, and notes on development.

Editor preferences are available in the editor config for easy use in common text editors. Read more and download plugins at http://editorconfig.org.

Versioning

For transparency into our release cycle and in striving to maintain backward compatibility, ngx-dadata is maintained under the Semantic Versioning guidelines.

See the Releases section of our project for changelogs for each release version.

Creators

Andrey Kolkov

• https://github.com/kolkov