0


Please or Register to create posts and topics.

mobileQuery.addEventListener

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 ..

HI,

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

.. 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.  

Uploaded files:
  • image.png

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

@Chris,

 

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

Regards

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;
}