Angular 角度2根据当前路由器状态更改sidenav内容

我正在Angular 2中开发单页应用程序。我正在使用角材质mat sidenav和mat工具栏。工具栏上有sidenav切换按钮、打开“客户端”部分和“报告”部分的按钮。这种结构在整个项目中都很常见

因此，该应用程序如下所示：

---

我必须根据路由器的当前状态更改sidenav（和主字段）中的内容。因此，如果“客户机”部分打开，sidenav应该显示一些与客户机相关的小节。同样，对于“报告”部分，应仅提供与报告相关的小节。我该怎么做

我通过检查URL路径是否包含某些指定部分来完成这项工作。例如，如果您想为客户端提供可见的子菜单，它可以是

'/clients'

等。然后您只需使用

*ngIf

指令：

<ul *ngIf="location.includes('/clients')">

---

除了

NavigationEnd

路由器发出多个其他事件，所以我们在上面的示例中过滤它们，在订阅之后，我们正在更新

位置

属性

我通过检查URL路径是否包含某个指定部分来完成这项工作。例如，如果您想为客户端提供可见的子菜单，它可以是

'/clients'

等。然后您只需使用

*ngIf

指令：

<ul *ngIf="location.includes('/clients')">

---

除了

NavigationEnd

路由器发出多个其他事件，所以我们在上面的示例中过滤它们，在订阅之后，我们正在更新

位置

属性

我已经想出了如何使用布局方法来做到这一点。您可以看到使用此方法实现管理系统的示例

我已经了解了如何使用布局方法来实现这一点。您可以看到使用此方法实现管理系统的示例