다음 routerLink
과 같은 경로에 매개 변수를 전달할 수 있다는 것을 알고 있습니다
/user/:id
글로
[routerLink]="['/user', user.id]"
그러나 이와 같은 경로는 어떻습니까?
/user/:id/details
이 매개 변수를 설정하는 방법이 있습니까? 아니면 다른 URL 체계를 고려해야합니까?
다음 routerLink
과 같은 경로에 매개 변수를 전달할 수 있다는 것을 알고 있습니다
/user/:id
글로
[routerLink]="['/user', user.id]"
그러나 이와 같은 경로는 어떻습니까?
/user/:id/details
이 매개 변수를 설정하는 방법이 있습니까? 아니면 다른 URL 체계를 고려해야합니까?
답변:
특정 예에서 다음을 수행합니다 routerLink
.
[routerLink]="['user', user.id, 'details']"
컨트롤러에서 그렇게하려면 다음을 주입 Router
하고 사용할 수 있습니다.
router.navigate(['user', user.id, 'details']);
라우팅 및 탐색 의 각도 문서 링크 매개 변수 배열 섹션 에 대한 추가 정보
<button mat-button routerLink="...">View user</button>
구문?
먼저 테이블에서 구성하십시오.
const routes: Routes = [
{
path: 'class/:id/enrollment/:guid',
component: ClassEnrollmentComponent
}
];
이제 유형 스크립트 코드에서 :
this.router.navigate([`class/${classId}/enrollment/${4545455}`]);
다른 구성 요소에서 매개 변수를 받다
this.activatedRoute.params.subscribe(params => {
let id = params['id'];
let guid = params['guid'];
console.log(`${id},${guid}`);
});
이를 달성하는 방법에는 여러 가지가 있습니다.
routerLink 속성을 사용하면 기능 모듈이 지연로드 된 경우를 대비하여 RoutingModule을 기능 모듈로 가져 오거나 AppModule 가져 오기 배열에 자동으로 추가되지 않은 경우 app-routing-module을 가져와야합니다.
<a [routerLink]="['/user', user.id]">John Doe</a>
<a routerLink="urlString">John Doe</a> // urlString is computed in your component
// Inject Router into your component
// Inject ActivatedRoute into your component. This will allow the route to be done related to the current url
this._router.navigate(['user',user.id], {relativeTo: this._activatedRoute})
this._router.navigateByUrl(urlString).then((bool) => {}).catch()