diff --git a/apps/angular/22-router-input/src/app/test.component.ts b/apps/angular/22-router-input/src/app/test.component.ts
index 747ab4483..87c51f40b 100644
--- a/apps/angular/22-router-input/src/app/test.component.ts
+++ b/apps/angular/22-router-input/src/app/test.component.ts
@@ -1,21 +1,16 @@
-import { AsyncPipe } from '@angular/common';
-import { Component, inject } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-import { map } from 'rxjs';
+import { Component, Input as RouterInput } from '@angular/core';
@Component({
selector: 'app-subscription',
- imports: [AsyncPipe],
+ imports: [],
template: `
-
TestId: {{ testId$ | async }}
- Permission: {{ permission$ | async }}
- User: {{ user$ | async }}
+ TestId: {{ testId }}
+ Permission: {{ permission }}
+ User: {{ user }}
`,
})
export default class TestComponent {
- private activatedRoute = inject(ActivatedRoute);
-
- testId$ = this.activatedRoute.params.pipe(map((p) => p['testId']));
- permission$ = this.activatedRoute.data.pipe(map((d) => d['permission']));
- user$ = this.activatedRoute.queryParams.pipe(map((q) => q['user']));
+ @RouterInput() testId!: string;
+ @RouterInput() permission!: string;
+ @RouterInput() user!: string;
}
diff --git a/apps/angular/22-router-input/src/main.ts b/apps/angular/22-router-input/src/main.ts
index 4919bb4e9..241b97ae4 100644
--- a/apps/angular/22-router-input/src/main.ts
+++ b/apps/angular/22-router-input/src/main.ts
@@ -1,9 +1,8 @@
-import { provideZoneChangeDetection } from '@angular/core';
import { bootstrapApplication } from '@angular/platform-browser';
+import { provideRouter, withComponentInputBinding } from '@angular/router';
import { AppComponent } from './app/app.component';
-import { appConfig } from './app/app.config';
+import { appRoutes } from './app/app.routes';
bootstrapApplication(AppComponent, {
- ...appConfig,
- providers: [provideZoneChangeDetection(), ...appConfig.providers],
-}).catch((err) => console.error(err));
+ providers: [provideRouter(appRoutes, withComponentInputBinding())],
+});