깜놀하는 해므찌로

Angular router parameter get 방식 전송 예시 본문

IT

Angular router parameter get 방식 전송 예시

agnusdei1207 2023. 5. 1. 19:28
반응형
SMALL
[routerLink]="['./', admin.id]"

1. 요청할 페이지 템플릿

 

 

 

 

 

import { RouterModule } from '@angular/router';

2. 요청할 페이지 컴포넌트

 

 

 

{
    path: '',
    children: [
      {
        path: 'admin',
        children: [
          { path: '', component: AdminPage },
          { path: ':id', component: AdminDetailPage },
        ],
      },
    ],
  },

3. 라우터 설정 : id라는 변수로 보낼 것을 명시, : 변수명 앞에 콜론 반드시 명시

 

 

 

import { ActivatedRoute } from '@angular/router';

constructor(
    private activateRoute: ActivatedRoute
  ) {}
let id = +this.activateRoute.snapshot.params['id'];

4. 요청 받을 페이지 컴포넌트

반응형
LIST