onChange event not emitting while using matGoogleMapsAutocomplete directive

[yaminagile]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

OS and Version?

Linux Debian (Ubuntu 16.04)

Versions

Angular CLI: 10.0.4
Node: 12.18.1
OS: linux x64

Angular: 10.0.5
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.901.12
@angular-devkit/build-angular      0.1002.0
@angular-devkit/build-optimizer    0.1002.0
@angular-devkit/build-webpack      0.1002.0
@angular-devkit/core               9.1.12
@angular-devkit/schematics         9.1.12
@angular/cdk                       10.1.0
@angular/cli                       10.0.4
@angular/flex-layout               10.0.0-beta.32
@angular/material                  10.1.0
@angular/material-moment-adapter   10.2.5
@ngtools/webpack                   10.2.0
@schematics/angular                9.1.12
@schematics/update                 0.901.12
rxjs                               6.5.5
typescript                         3.9.7
webpack                            4.44.1

Repro steps

component.html

<mat-form-field class="half-input">
      <input matInput matGoogleMapsAutocomplete (onChange)="onAutocompleteChanged($event)"
            (onAutocompleteSelected)="onAutocompleteSelected($event)" formControlName="address"  />
</mat-form-field>

component.ts

onAutocompleteChanged(event) {
    console.log("onAutocompleteChanged", event);
}

onAutocompleteSelected(event) {
    console.log("onAutocompleteSelected", event);
}

Desired functionality

I have been using angular-material-extensions/google-maps-autocomplete@5.0.0, I have to show required validation message if user cleared input box, & onAutocompleteSelected firing during address selection but onChange is not firing if user enter the address manually or select from autocomplete or remove address from input, would you please help me with that? why onChange event is not emitting?

Mention any other details that might be useful

You can see that onChange Defined in projects/angular-material-extensions/google-maps-autocomplete/src/lib/directives/mat-google-maps-autocomplete.directive.ts:39 but never emitted this event

[AnthonyNahas]

onChange will only fire when the input value changes and not if the autocompletet address is selected

[yaminagile]

@AnthonyNahas thanks for the replying onChange will not firing also when we enter the address manually and remove the autocomplete address

[ryancraigmartin]

@AnthonyNahas I just came across this issue. I am not getting any onChange events emitted when changing the value of the input either. I am trying to set a default value for an input with this directive when creating a formArray onInit. Any advice would be appreciated.

[yaminagile]

@ryancraigmartin You are using reactive forms than you can pass the initial value in formControl for default value for the input

[ryancraigmartin]

@ryancraigmartin You are using reactive forms than you can pass the initial value in formControl for default value for the input

Unfortunately that doesn't seem to work. The form input doesn't register the initial value as an autocomplete selection, so the value is passed but never actually triggers a change on the input.

[jrlumbang]

Hi, having the same issue. Hoping for a fix soon.

[AnthonyNahas]

I wpuld appreciate a PR