Route Parameters — Angular

Route parameters memungkinkan URL dinamis. Konfigurasi export const routes: Routes = [ { path: "user/:id", component: UserDetailComponent }, { path: "blog/:slug

Route parameters memungkinkan URL dinamis.

Konfigurasi

export const routes: Routes = [
  { path: "user/:id", component: UserDetailComponent },
  { path: "blog/:slug", component: BlogPostComponent },
]

Membaca Parameter

export class UserDetailComponent {
  private route = inject(ActivatedRoute)

  ngOnInit() {
    // Snapshot (sekali baca)
    const id = this.route.snapshot.paramMap.get("id")

    // Observable (reactive)
    this.route.paramMap.subscribe(params => {
      const id = params.get("id")
    })
  }
}

Query Parameters

<a [routerLink]="['/search']" [queryParams]="{ q: 'angular' }">
  Cari Angular
</a>
const query = this.route.snapshot.queryParamMap.get("q")

Yang akan kamu pelajari