How to enable view transitions in an Angular 17 app with NgModules?

Question

The Angular 17 blog post says:

You can add this feature to your app today by configuring it in the router’s provider declaration during bootstrap:

bootstrapApplication(App, {
  providers: [
    provideRouter(routes, withViewTransitions()),
  ]
});

However, I'm using NgModules, so my main.ts bootstrap looks like this:

platformBrowserDynamic().bootstrapModule(AppModule)

And the RouterModule is imported in the each of the modules, like:

@NgModule({
  imports: [
    RouterModule.forChild(routes),
  ]

So, no providers and no provideRouter() method. Where do I need to add withViewTransitions()?

Answer 1

You you can do it with it forRoot. You need to set this up at the application level.

RouterModule.forRoot([ /* routes...*/], {enableViewTransitions: true}], 

This is defined in ExtraOptions.