Angular &引用；无法匹配任何路由。URL段：…”；尝试使用命名出口时出错

我正试图通过一个指定的出口将

/login

路由添加到我的应用程序。所有其他路由都在主出口内，只有登录页面应该位于不同的出口中。这是我在

app.module.ts

中的

appRoutes

数组中设置的

/login

路径：

{ path: 'login',
  component: LoginComponent,
  data: { title: 'Login' },
  outlet: 'login'
}

在我的

app.component.html

模板中，我有以下内容：

<app-main-nav>
  <router-outlet></router-outlet>
</app-main-nav>
<router-outlet name="login"></router-outlet>

我试图通过在浏览器中键入URL直接导航到登录页面，但是我得到了错误

error:无法匹配任何路由。URL段：“登录”

当我将登录路径添加到主出口时，它可以正常工作，但是

被包裹在它周围，这正是我想要将此页面与其他页面分开并为其提供自己的出口的原因。我已经搜索过这个错误消息，但对于大多数人来说，问题似乎是他们的模板中的

routerLink

是错误的，但是由于我试图通过URL栏手动导航到此路由，这些解决方案不适用于我。我的代码怎么了？

试试这个url

---

这是为了指定哪个路由器将采用哪个路由

尝试了它，我不再得到任何错误，但是页面上没有呈现

LoginComponent

，只有主导航栏在那里，下方有一个空页面。很抱歉，

LoginComponent

实际上正在页面上呈现，但它被主导航栏一路向下推，主导航栏现在仍在渲染，其中的主导航栏是空的。我可以用一个检查用户是否登录的

*ngIf

来摆脱它，但是我想我也可以用主出口内的登录组件来做同样的事情？是的，你可以这样做，因为你不必像这样主控url，这会很糟糕。请做一个stackblitz示例