Estoy creando un componente de autocompletado para la búsqueda de direcciones con el servicio de Google Maps, para lo cual estoy usando Angular 9. Mi componente funciona, pero NECESITO CAPTURAR EL VALOR DE LA ENTRADA CUANDO NO HAY BÚSQUEDAS DISPONIBLES UTILIZANDO EL EVENTO BLUR O CUANDO LA ENTRADA PERDER EL ENFOQUE.
Actualmente, el componente detecta cuando selecciono una dirección, pero necesito que también detecte el texto que escribo cuando no encuentra nada.
mi html:
<input #search class="form-control" [formControl]="myAddress" type="text" placeholder="Enter a location">Mis ts:
export class AddressComponent implements OnInit { @Output() onSelectAddress = new EventEmitter<CustomAddressModel>(); myAddress = new FormControl(''); selectedAddress: PlaceResult; @ViewChild('search') searchElementRef: ElementRef; constructor( private _mapsAPILoader: MapsAPILoader, private ngZone: NgZone, ) { } ngOnInit(): void { this._mapsAPILoader.load().then(() => { const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement); autocomplete.addListener("place_changed", () => { this.ngZone.run(() => { this.selectedAddress = autocomplete.getPlace(); if (!this.selectedAddress.geometry) { return; } const result = { lat: this.selectedAddress.geometry.location.lat(), long: this.selectedAddress.geometry.location.lng(), strAddress: this.selectedAddress.formatted_address } as CustomAddressModel; this.onSelectAddress.emit(result); }); }); }); } }¿Alguna idea?
por lo general, debe suscribirse a los cambios de valor del control de entrada.
ngOnInit() { this.formchanges(); } formchanges() { this.yourform.controls['myAddress'].valueChanges.pipe( debounceTime(500), finalize(() => { })).subscribe(x => { var address = safeTrim(this.yourform.get('myAddress').value); this.getAddress(address); } }); } getAddress() { //your call to the google maps api goes here }No estoy seguro, pude responder a su pregunta o no.