angular里使用ng-zorro，怎么实现刷新页面后，左侧对应的路由所属的父级为展开状态

Question

按照官网说明将ng-zorro添加到angular7到项目里，但是使用菜单组件时发现如果是直接点击切换显示是正常的，但是如果页面刷新，访问的是nz-submenu下的子路由，对应的菜单却无法实现展开状态：

<li nz-submenu>
        <span title><i nz-icon type="appstore"></i> 用户管理</span>
        <ul>
          <li nz-menu-item [routerLink]="/user/list" routerLinkActive="ant-menu-item-selected">用户列表</li>
          <li nz-menu-item [routerLink]="/user/pages" routerLinkActive="ant-menu-item-selected">Option 6</li>
        </ul>
</li>

如上结构，如果在/user/list路由下刷新页面，用户管理菜单不会自动被展开。
如果给用户管理添加routerLinkActive="ant-menu-submenu-open"，可以让其箭头状态正确，子菜单还是不会显示。
有没有好的处理方法能实现我想实现的效果呢？

Answer 1

路由如果没有办法响应的话，估计只有手动检查路由当前路径，然后控制了这个展开状态了。

Answer 2

我今天也遇到你一样的问题，我审查官网的源代码：

发现只要写成如下：<li nz-submenu nzOpen>...</li> 就可以了，对就是加上 nzOpen 就可以了！亲测有效。

Answer 3

    <li
    nz-submenu
    routerLinkActive
    #rla="routerLinkActive"
    [nzOpen]="rla.isActive"
>

Answer 4

评论里回复格式好乱，我又在下面补充一下，我发现如果有多个li标签要声明多个模板变量来进行父结点刷新页面时自动展开，借助isActive根据子节点选中来设置父结点展开[nzOpen]，[nzMatchRouter]属性可以让菜单根据路由自动选中

<li nz-submenu [nzOpen]="rla1.isActive" #rla1="routerLinkActive" routerLinkActive>
  <span title><span class="nav-text"> 用户管理</span></span>
  <ul>
    <li nz-menu-item [nzMatchRouter]="true"><a routerLink="/user/list">用户列表</a></li>
  </ul>
</li>
<li nz-submenu [nzOpen]="rla2.isActive" #rla2="routerLinkActive" routerLinkActive>
  <span title><span class="nav-text"> 用户权限</span></span>
  <ul>
    <li nz-menu-item [nzMatchRouter]="true"><a routerLink="/user/role">角色</a></li>
  </ul>
</li>