如何在主路由器出口内使用命名路由器出口？

Question

我有一个主要的路由器出口（在我的side-nav组件内部），并且在其中创建了另外两个路由器出口。

我有这样的东西。

   router-outlet (primary) {

       router-outlet name='info' { }

       router-outlet name='services' {

          the path I want to navigate only inside this outlet

       }
    }

我相信这里有问题：

<button [routerLink]="[{ outlets: { primary: { services: ['view'] }}}]"> Go to services view</button>

我在stackblitz上编码了一个简单的版本

https://stackblitz.com/edit/router-outlet-doubt

我希望导航到查看服务组件，有人可以帮助我吗？

Answer 1

  

空的主要细分受众群中的次要子商店不匹配

这是一个已知问题，尚未解决。您可以在github上查看一个未解决的问题。

您在stackblitz上有一种解决方法

我重写了您的代码，现在它可以工作了。在这里stackblitz

到目前为止我已经改变了。

1. 我将空的父级更改为名为app的路由器，该路由器引用了BudgetsComponent，因为它是解决此问题的方法。

2. 按如下所示更改视图routerLink

   <button [routerLink]="[{outlets: {services: ['view']}}]"> Go to services view</button>

   其中services是出口名称，而view是路由路径。