2016-07-07 1 views
14

쿼리 매개 변수와 함께 Angular2 라우터 탐색 (라우터 3.0.0-alpha.7)을 사용하는 방법을 알아 내려고합니다.새로운 라우터 v3 Angular2로 모든 쿼리 매개 변수 지우기

내가 쉽게 선이있는 queryParam와 경로를 탐색 할 수 있습니다 :

this._router.navigate(['/login'], {queryParams: {redirect: 'route1'}}); 

를 '/ 로그인'구성 요소에서 여기의 redirect 경로에 즉 route1 리디렉션 몇 가지 로그인을한다. 그러나 리디렉션 후에는 redirect 검색어 매개 변수가 URL에 그대로 유지됩니다. 즉, 이제는 /route1?redirect=route1 페이지에 있습니다. 여기서 리디렉션 매개 변수를 제거하고 싶습니다. 그때 같은 redirect queryParam으로 다른 페이지로 이동하면

는 또한, 그것은 이전을 덮어하지만, URL에 다른 ?redirect=...를 추가하지 않습니다. 즉 : 경로를 탐색 할 때

this._router.navigate(['/another-route'], {queryParams: {redirect:'route2'}}); 

는 queryParams을 취소 것이 가능 /another-route?redirect=route2?redirect=route1

날 리드? this._router.navigate(['/route1'], {queryParams: {redirect: null}}); 또는 {queryParams: null} 등을 시도했지만 성공하지 못했습니다.

답변

18

나는 이것으로 또한 고투했다. 당신은

당신이 할 수있는 ... 다른 경로로 이동하는 경우 라우터는 기본적으로 검색어 매개 변수를 지우 기대 중

this._router.navigate(['/route1'], {queryParams: {}}); 

또는

this._router.navigateByUrl('/route1'); 

또는

routerLink 사용 :

<a [routerLink]="['/applications']" [queryParams]="{}"> Applications</a> 
+0

routerLinks를 사용하여 어떻게 동일한 결과를 얻을 수 있습니까? ' Applications'은 구문 분석 오류를 발생시킵니다. 문서에서이 부분이 누락되었습니다. – leovrf

+0

대답을 – yarons

+2

에 추가합니다 ... 그래서 빈 쿼리 매개 변수를 추가하는 해결책이 * 모든 곳에서 * 링크가 사용됩니까? ..... ..... 소름 끼치게 .... – dudewad

6

실제로 ... 당신은 "라우터를 기대하지 말아야합니다. o 명확한 쿼리 매개 변수 ".

분명히 당신은 그것을 기대합니다. 하지만 중요한 라우터 설계 결정에 대해 잘 모르기 때문에 ... 불행히도 에 대해서는 아직 문서에 나와 있지 않으므로입니다. 우리는 지금 그것을 바로 잡기 위해 노력하고 있습니다.

QueryParams은 탐색을 통해 전역적인 매개 변수입니다. 그들은 변하지 않습니다.

MatrixParams은 현재 탐색에 속하는 매개 변수입니다. 이들은 변화한다.

무엇이 전세계에 속합니까 QueryParams? 서버에서 가져온 내용은 ​​후보자입니다. 모든 상호 작용에 속한 인증 토큰과 같습니다.

하지만 PARAMS 경로 (customer/:id에서 :id) 및 (/customers;name=Jo*에서 ;name=Jo* 등) PARAMS 선택적 행렬을 요구 한 탐색에 국부적. 이것이 선택적 이름 필터를 사용하여 고객을위한 네비게이션을 지정하는 방법입니다.

이 방법에 동의하든, v.3 라우터 디자인의 기본입니다.

예상치를 조정하는 것이 좋습니다.

+0

언제 MatrixParams에 관한 추가 세부 정보를 기대할 수 있습니까? @Ward – JRulle

+1

업데이트 된 라우터 장의 [쿼리 매개 변수] (https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters) 섹션에있는 내용 중 일부입니다. 하지만 저자와 나는 더 명확해질 수 있다고 생각합니다. 우리는 그것을 곧 다시 업데이트 할 것입니다. – Ward

+0

@Ward에게 감사드립니다. 업데이트 된 라우터 설명서를 계속 확인하겠습니다. – JRulle

0

당신이 시도 싶어 수 있습니다

this.router.navigate ([ '대상'], {preserveQueryParams : 거짓을});