Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(router): Create APIs for using Router without RouterModule (#47010)
This commit creates and exposes the APIs required to use the Angular Router without importing `RouterModule`. The newly added APIs are tree-shakable and you can add features using special functions rather than using `ExtraOptions` to control the providers via an internal switch in Router code. ``` const appRoutes: Routes = []; bootstrapApplication(AppComponent, { providers: [ provideRouter(appRoutes, withDebugTracing(), // enables debug tracing feature withInMemoryScrolling() // enables scrolling feature ] } ); ``` This "features" pattern allows for router behavior to evolve in a backwards compatible and tree-shakable way in the future. This approach also makes features more discoverable. The newly added APIs can be used in any application today (doesn't require an application to be bootstrapped using standalone-based APIs). Note: APIs added in this commit are released in the "Developer Preview" mode, read more about this mode in Angular docs: https://angular.io/guide/releases#developer-preview PR Close #47010
- Loading branch information
Showing
32 changed files
with
1,066 additions
and
708 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 0 additions & 11 deletions
11
integration/cli-hello-world-lazy/src/app/app-routing.module.ts
This file was deleted.
Oops, something went wrong.
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
import {Routes} from '@angular/router'; | ||
|
||
|
||
export const appRoutes: Routes = [{ | ||
path: 'lazy', | ||
loadChildren: () => import('./lazy/lazy.routes').then(routes => routes.lazyRoutes), | ||
}]; |
12 changes: 0 additions & 12 deletions
12
integration/cli-hello-world-lazy/src/app/lazy/lazy-routing.module.ts
This file was deleted.
Oops, something went wrong.
Empty file.
1 change: 0 additions & 1 deletion
1
integration/cli-hello-world-lazy/src/app/lazy/lazy.component.html
This file was deleted.
Oops, something went wrong.
14 changes: 4 additions & 10 deletions
14
integration/cli-hello-world-lazy/src/app/lazy/lazy.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,15 +1,9 @@ | ||
import { Component, OnInit } from '@angular/core'; | ||
import {Component} from '@angular/core'; | ||
|
||
@Component({ | ||
standalone: true, | ||
selector: 'app-lazy', | ||
templateUrl: './lazy.component.html', | ||
styleUrls: ['./lazy.component.css'] | ||
template: '<p>lazy works!</p>', | ||
}) | ||
export class LazyComponent implements OnInit { | ||
|
||
constructor() { } | ||
|
||
ngOnInit() { | ||
} | ||
|
||
export class LazyComponent { | ||
} |
15 changes: 0 additions & 15 deletions
15
integration/cli-hello-world-lazy/src/app/lazy/lazy.module.ts
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
import {Routes} from '@angular/router'; | ||
|
||
import {LazyComponent} from './lazy.component'; | ||
|
||
export const lazyRoutes: Routes = [{path: '', component: LazyComponent}]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,12 +1,18 @@ | ||
import { enableProdMode } from '@angular/core'; | ||
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; | ||
import {enableProdMode} from '@angular/core'; | ||
import {bootstrapApplication, provideProtractorTestingSupport} from '@angular/platform-browser'; | ||
import {provideRouter} from '@angular/router'; | ||
|
||
import { AppModule } from './app/app.module'; | ||
import { environment } from './environments/environment'; | ||
import {AppComponent} from './app/app.component'; | ||
import {appRoutes} from './app/app.routes'; | ||
import {environment} from './environments/environment'; | ||
|
||
if (environment.production) { | ||
enableProdMode(); | ||
} | ||
|
||
platformBrowserDynamic().bootstrapModule(AppModule) | ||
.catch(err => console.error(err)); | ||
bootstrapApplication(AppComponent, { | ||
providers: [ | ||
provideRouter(appRoutes), | ||
provideProtractorTestingSupport(), | ||
] | ||
}).catch(console.error); |
Oops, something went wrong.