ag-grid: Regression: Navigation triggered outside Angular zone

I’m submitting a … (check one with “x”)

[x] bug report => see 'Providing a Reproducible Scenario'
[] feature request => do not use Github for feature requests, see 'Customers of AG Grid'
[] support request => see 'Requesting Community Support'

Providing a Reproducible Scenario

<a [routerLink]="[params.path, params.value]">Link</a>

When we follow the link, we get a warning Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'? and ngOnInit() doesn’t fire until we click somewhere.

This bug has appeared in version 31.0.2, everything is fine in versions 31.0.1 and earlier. Angular version: 17.1.0.

Temporal workaround (if anyone else is facing the same problem):

<a href="javascript:void(0)" (click)="navigate([params.path, params.value])">Link</a>

navigate(parts: unknown[]): void {
  this.ngZone.run(() => this.router.navigate(parts));
}

About this issue

Original URL
State: closed
Created 5 months ago
Reactions: 1
Comments: 23 (11 by maintainers)

Most upvoted comments

I am glad to hear the main issues are resolved in v31.0.3. Stale npm versions are always a gotcha!

The fact that it is running outside in 31.0.3 is expected but the fact that it slows things down is interesting. I wonder if what you are seeing is that calling the dialog while outside of ngZone means it does not get updated until some other part of your application triggers change detection to run.

My guess would be that is you triggered change detection at the end of your showDialog function that this would resolve the yankiness. If you don’t refactor those components to Angular components then you may want to wrap the contents of the showDialog function within ngZone.run().

Thank you for bring this edge case to my attention though of calling back into Angular from a JS component.

StephenCooper on Jan 26, 2024

The fix for this issue is now with QA, with the aim of being part of a patch release sometime next week.

I have updated the ZoneJs tests to include this use case which unfortunately was missed so this shouldn’t happen again.

Thank you very much for your help in pinpointing the issue which made it quicker for me to resolve.

StephenCooper on Jan 19, 2024