4

我试图在启动/初始路由上获取路由参数。但它不起作用。

app.component.ts

  import { ActivatedRoute } from '@angular/router';
  ...

  constructor(
    private activatedroute: ActivatedRoute
  ) {}

  ngOnInit() {
    console.log(this.activatedroute.snapshot.paramMap.get('token'));

    this.activatedroute.paramMap.subscribe( paramMap => {
      console.log(paramMap.get('token'));
    });
  }

app.module.ts（包括的不仅仅是这个）

import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
  { path: ':token', component: HelloComponent },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})

然后我提供我的应用程序并转到：

http://localhost:4200/123

但我的 app.component.ts 只是 console.log 的null null。为什么这不起作用？我觉得我的一切都是正确的。这是一个可以使用的 Angular Blitz：https ://stackblitz.com/edit/angular-wnrrkd

4

2 回答 2

4

您已经编写了app.component.ts根组件的代码，但是:token为子组件定义了代码，所以我已将代码移至子组件，另外需要注意的是，app.component.html您需要有路由器出口，它将显示子组件，只有这样令牌才会可见，请参考下面的示例。

Stackblitz example

于 2020-03-25T06:27:37.130 回答
0

尝试这个：

this.router.parseUrl(this.router.url).queryParams['coupon']
于 2021-10-22T09:59:47.990 回答