Question

我想从url获取令牌，但是它返回null作为值。

app.component.ts：

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {    
  constructor(private route: ActivatedRoute) { }

    ngOnInit(){  
    const token = this.route.snapshot.paramMap.get('token');
    console.log(token);

和routing.ts

{ path: ':token', component: AppComponent }

我想在URL中的/之后获取内容，例如：localhost：4200 / content-to-grab 有解决方案吗？

Answer 1

您的方法还可以，还有另一个概念上的问题：

您正在尝试将路径与根组件相关联。

您的根模块很可能像这样：

@NgModule({
  imports: [
    RouterModule.forRoot(...)
  ],
  declarations:[
    ...
    AppComponent,
    ...
  ],
  boostrap: [AppComponent]
})
export class AppModule {}

框架在引导步骤中实例化的AppComponent的第一个实例将用作根组件，因此，注入的{{ 1}}会与您的路线定义“分离”。

此外，通过ActivatedRoute指令解析的AppComponent实例将知道您的路由定义。

您可以在following stackblitz中自行检查。

注入到RouterOutlet的第一个实例中的ActivatedRoute实例不会以异步或同步方式反映路由参数。如果导航到类似AppComponent的地方，则{url}/#/bla会解决AppComponent的第二个实例。插入其中的<router-outlet>实例将反映两个同步的路由参数值。和异步。

Answer 2

将代码更改为

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

Answer 3

尝试像这样抓住它。

this.route.snapshot.params["token"]

Answer 4

ngOnInit(){  
    const token = this.activatedRout.snapshot.params.token;
}

无法通过根组件中的route.snapshot访问路由参数

4 个答案: