Angular 2 路由器 queryParams 未添加到 url [英] Angular 2 router queryParams are not added into url

查看:73
本文介绍了Angular 2 路由器 queryParams 未添加到 url的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个身份验证保护程序,它可以保护我的网络应用程序的某些页面.在重定向期间,我想将 queryParams 添加到我的 url 以允许用户返回他想要通过的站点.下面的代码工作了几次.今天我意识到url中不存在queryParms

I have an auth guard, which protects somes pages of my web-app. During the redirect i wanted to add queryParams to my url to allow user to come back to the site he want to pass. Code below was working for a few time. Today i realised that queryParms are not present in the url

async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
  let isLogged: boolean =  this.loggedInCustomer.isLoggedIn();
  if (!isLogged) {
    console.log(state.url);
    this.router.navigateByUrl(this.env.getLoginUrl(), { queryParams: {returnUrl: state.url}});
      return false;
    }
    return true;
 }

我已经检查过 state.url 是正确的.所以问题可能出在创建路由器 url 上.

i've checked state.url it is correct. So the problem may be in creating router url.

我已经做了临时解决方案

I have made temporary solution

this.router.navigateByUrl(`${this.env.getLoginUrl()}?returnUrl=${state.url}`);

这里是类似问题的链接在 angular 2 中设置路由器 queryParams 不起作用

但我知道这不好.你能向我解释一下我在这个查询中做错了什么吗?为什么它停止工作?问候!

But i know that it is not good. Can you please explain to me what am i doing wrong with this query? Why it stopped working? Regards!

推荐答案

NavigateByUrl 总是绝对的 Angular 文档.相反,您可以使用 navigate:

NavigateByUrl is always absolute Angular Doc's. Instead you can use navigate:

    let navigationExtras: NavigationExtras = {
      queryParams: { 'returnUrl': state.url },
      fragment: 'anchor'
    };

    this.router.navigate([this.env.getLoginUrl()], navigationExtras);

这篇关于Angular 2 路由器 queryParams 未添加到 url的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆