angular - 如何在 Angular 中使用快照或 ActivatedRoute 订阅者从 URL 获取 id？

Question

我使用快照方法获取值，但在本例中，它是在“类”之后获取值 20，但我需要像获取这样的 33 路径

credits/33/classes/20 only 20 or credits/33/classes/ only null("")

更新: 我找到了问题的解决方案。

现在它可以正确获取 id 了。错误是访问右侧子组件中的元素，在快照版本中子组件的 MatDialog 组件中不起作用。

constructor(private route: ActivatedRoute) {} 
 ngOnInit(): void {
   console.log(parseInt(this.route.snapshot.paramMap.get('id1')));

If your url has 2 Id values, you can use snapshot of route.parent

   console.log(parseInt(this.route.parent.snapshot.paramMap.get('id1')));
}

Answer 1

您在路由模块中的路径将是

const appRoutes: Routes = [
{ path: 'credits/:id1/classes/:id2', component: YourComponent }];

假设 id1 是 33 并且 id2 是 20

代码将是: 使用ActivatedRoute而不是ActivatedRouteSnapshot

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

constructor(private route: ActivatedRoute) {

ngOnInit() {
this.route.params
      .subscribe(
        (params: Params) => {
          this.id1 = +params['id1'];
          this.id2 = +params['id2'];
          console.log(id1 + '' + id2);
        }
      );
    }
}