query - angular router events
Borrar todos los queryParams con el nuevo Router v3 Angular2 (3)
Estoy intentando averiguar cómo utilizar la navegación del enrutador Angular2 (enrutador 3.0.0-alpha.7) con parámetros de consulta.
Puedo navegar fácilmente a una ruta con un queryParam con esta línea:
this._router.navigate([''/login''], {queryParams: {redirect: ''route1''}});
En el componente ''/ login'', hago un inicio de sesión que redirige a la ruta de redirect , es decir, route1 aquí. Sin embargo, después de la redirección, los parámetros de consulta de redirect permanecen en la URL, es decir, ahora estoy en page /route1?redirect=route1 . Quiero eliminar el parámetro de redirección aquí.
Además, si luego navego a otra página con el mismo redirect queryParam, no sobrescribe la anterior, sino que agrega otra ?redirect=... en la url. A saber:
this._router.navigate([''/another-route''], {queryParams: {redirect:''route2''}});
me lleva a /another-route?redirect=route2?redirect=route1
¿Es posible borrar los queryParams al navegar entre rutas? Intenté this._router.navigate([''/route1''], {queryParams: {redirect: null}}); , o {queryParams: null} etc. pero no tiene éxito.
En realidad ... NO debe " esperar que el enrutador borre los parámetros de consulta ".
Claramente, sí lo esperas. Pero eso se debe a que no conoce una decisión importante sobre el diseño del enrutador ... probablemente porque, desafortunadamente, aún no se lo hemos dicho en la documentación . Estamos trabajando para corregir eso ahora.
Los QueryParams son para parámetros que son globales en todas las navegaciones; Ellos no cambian.
Los MatrixParams son para los parámetros que pertenecen a la navegación actual; estos sí cambian.
¿Qué pertenece a los QueryParams globales? Las cosas que vienen del servidor son candidatas. Como tokens de autenticación que pertenecen a cada interacción.
Pero los parámetros de ruta requeridos (el :id en customer/:id ) y los parámetros de matriz opcionales (como el ;name=Jo* en /customers;name=Jo* ) son locales para una navegación. Así es como puede especificar una navegación para clientes con un filtro de nombre opcional.
Si está de acuerdo o no con este enfoque, es fundamental para el diseño del enrutador v.3.
Sugiero ajustar tus expectativas en lugar de luchar contra ellas.
Luché con esto también. Usted esperaría que el enrutador borre los parámetros de consulta de manera predeterminada cuando navegue a otra ruta ...
Puedes hacer cualquiera
this._router.navigate([''/route1''], {queryParams: {}});
o
this._router.navigateByUrl(''/route1'');
o cuando se utiliza routerLink :
<a [routerLink]="[''/applications'']" [queryParams]="{}"> Applications</a>
Quizás quieras probar esto:
this.router.navigate ([''target''], {preserveQueryParams: false});