使用 Angular 中的父级获取子路由

在 Angular 中，如果我们想要从父级组件中获取子路由中的参数，我们可以使用 ActivatedRoute 模块。这个模块包含了当前路由的信息，包括路由参数和 URL。

导入模块

首先，我们需要导入 ActivatedRoute 模块。在我们的组件中添加以下代码：

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

构造函数

接下来，我们需要在我们的组件的构造函数中注入 ActivatedRoute 模块。在构造函数中添加以下代码：

constructor(private route: ActivatedRoute) { }

这里的 route 参数将包含当前路由的信息。

获取参数

现在，我们可以使用 RouteParams 对象来获取参数。以下是一个示例：

const id = this.route.snapshot.paramMap.get('id');

这将获取子路由中名为 id 的参数。

如果你想在组件加载后获取参数，而不是在快照中获取它们，可以使用 subscribe 方法。以下是一个示例：

this.route.paramMap.subscribe(params => {
    const id = params.get('id');
    // do something with id
});

这将订阅参数的变化，并在参数变化时获取新的值。

结论

在 Angular 中，使用 ActivatedRoute 模块可以轻松地从父级组件中获取子路由中的参数。通过注入 ActivatedRoute 模块并使用 RouteParams 对象，你可以获取任何你需要的参数。