ERROR Error: Method not implemented.

miki-lauda commented 3 years ago

Bug Report or Feature Request (mark with an `x`)

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

OS and Version?

Windows 10 Education 1909

Versions

Angular: 11.0.3

Repro steps

I tried to use mat-google-maps-autocomplete for reactive forms, so I just copied example from documentation, so my template looks like this <form [formGroup]="addressFormGroup"> <mat-google-maps-autocomplete formControlName="address"> </mat-google-maps-autocomplete> </form>

Here is code from component: `import { Component, OnInit } from '@angular/core'; import { FormControl, FormGroup } from '@angular/forms';

@Component({ selector: 'app-cultural-offer-form', templateUrl: './cultural-offer-form.component.html', styleUrls: ['./cultural-offer-form.component.scss'] }) export class CulturalOfferFormComponent implements OnInit {

addressFormGroup: any;

constructor() { }

ngOnInit(): void { this.addressFormGroup = new FormGroup({ address: new FormControl(), });

this.addressFormGroup?.get('address')?.valueChanges.subscribe(value => console.log('value changed', value))

} }`

In app.module.ts I have this in imports: AgmCoreModule.forRoot({ apiKey: environment.google_api_key, libraries: ['places'], language: 'en' }), MatGoogleMapsAutocompleteModule, ReactiveFormsModule, FormsModule

But it doesn't work I got this:

core.js:6006 ERROR Error: Method not implemented. at MatGoogleMapsAutocompleteComponent.registerOnTouched (angular-material-extensions-google-maps-autocomplete.js:264) at setUpBlurPipeline (forms.js:2516) at setUpControl (forms.js:2391) at FormGroupDirective.addControl (forms.js:5617) at FormControlName._setUpControl (forms.js:6166) at FormControlName.ngOnChanges (forms.js:6113) at FormControlName.rememberChangeHistoryAndInvokeOnChangesHook (core.js:1466) at callHook (core.js:2485) at callHooks (core.js:2451) at executeInitAndCheckHooks (core.js:2403)

TypeError: Cannot read property 'nativeElement' of undefined at angular-material-extensions-google-maps-autocomplete.js:173 at ZoneDelegate.invoke (zone-evergreen.js:364) at Object.onInvoke (core.js:28267) at ZoneDelegate.invoke (zone-evergreen.js:363) at Zone.run (zone-evergreen.js:123) at zone-evergreen.js:857 at ZoneDelegate.invokeTask (zone-evergreen.js:399) at Object.onInvokeTask (core.js:28255) at ZoneDelegate.invokeTask (zone-evergreen.js:398) at Zone.runTask (zone-evergreen.js:167)

I want to mention that I tried to use mat-search-google-maps-autocomplete replacing mat-google-maps-autocomplete with mat-search-google-maps-autocomplete while everything else was same and it works fine, but I don't want to have street, nr, plz and locality, because I need to have only one input, so it can't help me.

AnthonyNahas commented 3 years ago

which version of the library are you using?

miki-lauda commented 3 years ago

I was using version 6.0.0. Now I'm on version 6.2.0, but the problem is still there.

Navil commented 3 years ago

Same issue here. Is there a workaround to not have the value accessor throw that error?

MuhammadShuja commented 3 years ago

Still, facing this issue, any solution to this?

angular-material-extensions / google-maps-autocomplete