Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
André Schröter
30
Hammer is not defined error after upgrading to Angular 9
posted

Hello!

after upgrading to Angular 9 and following the instructions of
https://ko.infragistics.com/products/ignite-ui-angular/angular/components/general/update_guide.html#additional-manual-changes
I keep getting a "Hammer is not defined" error in the browser console.
("IgxGridRowComponent.html:73 ERROR ReferenceError: Hammer is not defined at new HammerGesturesManager" to be precise.)

I tried to add the HammerModule in many ways and different locations (app.module and below). Also I tried to switch off switch off Angular 9’s Ivy but had no luck.

In the end I imported it by string in main.ts (import "hammerjs";) This depecated way of importing still works somehow but for obvious reasons I want to get rid of it.

Ideas anybody?

Parents
No Data
Reply
  • 720
    Verified Answer
    Offline posted

    Hallo André,

    Thank you for contacting Infragistics Support!

    Due to a breaking change in Angular 9 Hammer providers are no longer implicitly added. The Angular’s new HammerModule only enables HammerJS event bindings which were previously enabled by default in Angular versions 8 and below. IgniteUI for Angular components are using such events and that’s why the HammerModule must be imported. Those events are dependent on the HammerJS script, which isn’t included in the HammerModule and therefore it must be imported as a side-effects only import either in the main.ts or in the scripts array of angular.json. 

    I have created a test project using Angular 8 and IgniteUI for Angular 8.2.x which I have updated to Angular 9 and IgniteUI for Angular 9.0.x using:

    • ng update @angular/cli
    • ng update igniteui-angular
    • I made sure that there is a hammerjs string import in the main.ts file.
    • Finally I imported the HammerModule in the app.module.ts.

    The result is that the updated Angular 9 project works as expected. I believe that you will find the described steps helpful.

    Please let me know if you need any further information.

    Best Regards,
    Martin Evtimov
    Entry Level Software Developer
    Infragistics, Inc.

Children