如何在angular

Question

我创建了一个页面，供用户忘记密码时重置密码。用户将收到一封电子邮件，其中包含重置密码页面的链接以及重置令牌。

密码页面的网址应如下所示：

http://localhost:4200/#/resetpassword?code=CfDJ8LBxIxG2Gf5IjZZG9p+g7oDJxTqYPL7OnGSOIblOksnbNniISOo/jKuZ8RkPriLpsCle5VNwVII5O+r9KPmos1WcwmKCB5mMbYeO/tVKxUiqymsEDFjvWEt0X+KfIQlPbe8fvTMtAaB07IG01vwT2UWn+CjEAYwcZgV6eKhPEP21U9lxLxeG8bE6SXMwninNvWI1lf6jm3Ia1MIDikqL9EC033AMIGlnjvEonbxV+Jb

这是我在路由器模块中的路线，并重置密码页面ngOnInit（）代码：

const routes: Routes = [
  {path: 'resetpassword?code=/:code', component: ResetpasswordComponent}
];

  ngOnInit() {
    debugger;
    const param = this.route.snapshot.paramMap.get('code');
    if(param) {
      this.Code = param;
    }
  }

我想知道：

1. 如何在路线定义中设置此路线？
2. 在重置密码页面的ngOnInit中，如何读取code =之后的code值？

任何可以指导我的人如何建立这样的路线并读取params值？

Answer 1

路径应为：

{path: 'resetpassword', component: ResetpasswordComponent}

导航

<a
    routerLink="/resetpassword"
    [queryParams]="{code: 'CfDJ8LBxIxG2Gf5IjZZG9p+g7oDJxTqYPL7OnGSOIblOksnbNniISOo/jKuZ8RkPriLpsCle5VNwVII5O+r9KPmos1WcwmKCB5mMbYeO/tVKxUiqymsEDFjvWEt0X+KfIQlPbe8fvTMtAaB07IG01vwT2UWn+CjEAYwcZgV6eKhPEP21U9lxLxeG8bE6SXMwninNvWI1lf6jm3Ia1MIDikqL9EC033AMIGlnjvEonbxV+Jb'}"
  >
  </a>

在resetPassword组件中：

constructor(private activeRoute: ActivatedRoute) {
    activeRoute.queryParams
      .subscribe((params) => 
        {
          console.log(params)
    });
  }

选中DEMO。