mobileQuery.addEventListener

#1 · September 4, 2020, 8:16 pm

Hi working with the Pro w angular 9.1.3 and mobile device with chrome browser and continue to receive Error: this.mobileQuery.addEventListener is not a function from my research it appears it should not be called until after the html is loaded not in constructor. I moved it in app.component to NgInit and still receive errors. hope someone has seen this before ..

#2 · September 6, 2020, 1:18 pm

HI,

Try calling this in ngAfterViewInit. Unfortunately, I cannot understand the error with me.

#3 · September 8, 2020, 1:37 pm

.. moved the function call to addEventListener() into ngAfterViewInit() with the same result. It was initially in the constructor and moved into ngOnInit . Please see image attached.

#4 · September 8, 2020, 2:25 pm

solved.. although addListener is deprecated it works fine in Chrome iOS latest. removeEventListener has no issues ..

Ingo has reacted to this post.

#5 · September 9, 2020, 3:23 pm

@Chris,

Please show the code how you used it. Thank you !!

Regards

#6 · September 9, 2020, 7:05 pm

app.component.ts

constructor(
storageManager: LocalStoreManager,
private toastaService: ToastaService,
private toastaConfig: ToastaConfig,
private accountService: AccountService,
private alertService: AlertService,
private notificationService: NotificationService,
private appTitleService: AppTitleService,
private authService: AuthService,
private translationService: AppTranslationService,
private matIconRegistry: MatIconRegistry,
private domSanitizer: DomSanitizer,
public configurations: ConfigurationService,
public router: Router,
public dialog: MatDialog,
changeDetectorRef: ChangeDetectorRef,
media: MediaMatcher) {

this.matIconRegistry.addSvgIconSet(this.domSanitizer.bypassSecurityTrustResourceUrl('../assets/custom-icons.svg'));

this.mobileQuery = media.matchMedia('(max-width: 600px)');
this._mobileQueryListener = () => changeDetectorRef.detectChanges();

storageManager.initialiseStorageSyncListener();

this.toastaConfig.theme = 'material';
this.toastaConfig.position = 'top-right';
this.toastaConfig.limit = 100;
this.toastaConfig.showClose = true;
this.toastaConfig.showDuration = false;
//this.mobileQuery.addEventListener('change', this._mobileQueryListener <= note the replacement to deprecated .addListener
this.mobileQuery.addListener( this._mobileQueryListener);
this.appTitleService.appName = this.appTitle;
}

Ingo has reacted to this post.

IMPORTANT!

This forum is now archived. Click here for the New Support Forum