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

Demo is here demo

Working code for this demo at stackblitz example

Install via npm package manager

npm install @kolkov/ngx-dadata --save

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: 'Тольятти',
       }        
   ]     
 };

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

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

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.

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.

Andrey Kolkov

• https://github.com/kolkov