Очистить все queryParams с помощью нового Router v3 Angular2
Я пытаюсь выяснить, как использовать навигацию маршрутизатора Angular2 (маршрутизатор 3.0.0-alpha.7) с параметрами запроса.
Я могу легко перейти к маршруту с помощью запросаParam с помощью этой строки:
this._router.navigate(['/login'], {queryParams: {redirect: 'route1'}});
В компоненте "/login" я делаю логин, который будет перенаправлен на маршрут redirect
, а именно route1 здесь. Однако после перенаправления параметры запроса redirect
остаются в URL-адресе, т.е. Я сейчас на странице /route1?redirect=route1
. Я хочу удалить параметр перенаправления здесь.
Кроме того, если я затем перейду на другую страницу с тем же redirect
queryParam, она не перезапишет предыдущую, а добавит еще один ?redirect=...
в url. А именно:
this._router.navigate(['/another-route'], {queryParams: {redirect:'route2'}});
приводит меня к /another-route?redirect=route2?redirect=route1
Можно ли очистить queryParams при навигации по маршрутам?
Я пробовал this._router.navigate(['/route1'], {queryParams: {redirect: null}});
или {queryParams: null}
и т.д., Но не имел успеха.
Ответы
Ответ 1
Я тоже боролся с этим. Вы ожидаете, что маршрутизатор очистит параметры запроса по умолчанию при навигации по другому маршруту...
Вы можете сделать
this._router.navigate(['/route1'], {queryParams: {}});
или
this._router.navigateByUrl('/route1');
или при использовании routerLink
:
<a [routerLink]="['/applications']" [queryParams]="{}"> Applications</a>
Ответ 2
На самом деле... вы НЕ должны "ожидать, что маршрутизатор очистит параметры запроса".
Ясно, что вы этого ожидаете. Но это потому, что вы не знаете о важном решении дизайна маршрутизатора... возможно, потому что, к сожалению, мы еще не говорили вам об этом в документах. Сейчас мы исправляем это.
QueryParams предназначены для параметров, которые являются глобальными в навигации; они не меняются.
MatrixParams относятся к параметрам, которые относятся к текущей навигации; они меняются.
Что принадлежит глобальному QueryParams
? Вещи, поступающие с сервера, являются кандидатами. Как auth-токены, которые принадлежат каждому взаимодействию.
Но требуемые параметры маршрута (:id
in customer/:id
) и необязательные параметры матрицы (например, ;name=Jo*
in /customers;name=Jo*
) являются локальными для одного навигации. Это то, как вы можете указать навигацию для клиентов с дополнительным фильтром имен.
Независимо от того, согласны ли вы с этим подходом, это принципиально для дизайна маршрутизатора v.3.
Я предлагаю корректировать ваши ожидания, а не бороться с ним.
Ответ 3
Вы можете попробовать:
this.router.navigate(['target'], {preserveQueryParams: false});