programing

Angular 2 라우터.항법

codeshow 2023. 10. 14. 10:44
반응형

Angular 2 라우터.항법

경로 및 쿼리 매개 변수가 혼합된 Angular 2의 경로로 이동하려고 합니다.

경로가 경로의 마지막 부분인 경로의 예시는 다음과 같습니다.

{ path: ':foo/:bar/:baz/page', component: AComponent }

배열을 사용하여 다음과 같이 연결 시도:

this.router.navigate(['foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams)

저는 어떤 오류도 발생하지 않고 있으며, 제가 이해할 수 있는 바로는 이것이 효과가 있을 것입니다.

(현재) Angular 2 문서의 예는 다음과 같습니다.

{ path: 'hero/:id', component: HeroDetailComponent }

['/hero', hero.id] // { 15 }

제가 어디가 잘못되었는지 누가 알 수 있습니까?3번 라우터에 있습니다.

첫번째 세그먼트가 시작하지 않는 경우/상대적인 경로입니다.router.navigate필요합니다.relativeTo상대 탐색을 위한 매개 변수

경로를 절대적으로 설정하는 경우:

this.router.navigate(['/foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams)

안그러면 당신이relativeTo

this.router.navigate(['../foo-content', 'bar-contents', 'baz-content', 'page'], {queryParams: this.params.queryParams, relativeTo: this.currentActivatedRoute})

참고 항목

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

export class ClassName {
  
  private router = ActivatedRoute;

    constructor(r: ActivatedRoute) {
        this.router =r;
    }

onSuccess() {
     this.router.navigate(['/user_invitation'],
         {queryParams: {email: loginEmail, code: userCode}});
}

}


Get this values:
---------------

ngOnInit() {
    this.route
        .queryParams
        .subscribe(params => {
            let code = params['code'];
            let userEmail = params['email'];
        });
}

참조: https://angular.io/docs/ts/latest/api/router/index/NavigationExtras-interface.html

매우 간단합니다.

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

constructor( private router:Router) {}

    return(){this.router.navigate(['/','input']);}

여기서 경로 입력으로 리디렉션됩니다.어떤 경로에 상대적인 특정 경로로 이동하려면 다음과 같습니다.

return(){this.router.navigate(['/relative','input']);}

반환 시()는 버튼 클릭 시 트리거되는 방법입니다.

<버튼(클릭)=반품()>홈

언급URL : https://stackoverflow.com/questions/38131293/angular-2-router-navigate

반응형