Angular 中的 RouterLink 和 RouterOutlet？

Question

RouterLink 和 RouterOutlet 都是 Angular 属性指令，有助于从路由集合中查找路由，匹配的路由加载组件，其底层模板将呈现在浏览器上。

为什么我们需要这两个指令，因为它们都执行类似的工作？

是的，我理解在 routerlink 指令中我们定义了映射到路由的路径，我们也可以对路由器出口做同样的事情，对吗？通过在路由器出口指令中定义可选名称属性和相同的名称，您可以将其与我们在路由数组中注册的路由中的出口属性一起使用。

路由器链路和路由器出口指令区别不清楚

Answer 1

RouterLink 用于提及导航组件的路径

<a [routerLink]="['url path']">

而 RouterOutlet 充当需要渲染组件的占位符

<router-outlet></router-outlet>

Answer 2

RouterLink -> 导航并让路由器引擎知道要在路由器出口内渲染哪些组件/路由

RouterOutlet -> 充当锚点，我的意思是，它将确定子/路由/组件应在 html 中呈现的位置。

两者相互依赖，共同作用以告知角度、路由到何处以及在何处渲染路由！

Answer 3

您可以通过将 RouterOutlet 视为页面上将呈现路由组件的占位符或位置来理解这一点。在 Angular 中，可以有多个 RouterOutlet。例如，想象一个布局分为页眉、页脚、主要内容（动态）和带有帖子列表的固定侧边栏（动态）。假设所有页面的页眉和页脚始终是静态（固定）的。

在这种情况下，您可以有两个命名的 RouterOutlet：一个用于主要内容，一个用于侧边栏。您可以根据当前路线或条件在每个出口处渲染不同的内容。

另一方面，RouterLink 用于创建导航链接，允许您在不同组件之间移动。 RouterOutlet 定义了路由内容的显示位置，而 RouterLink 仅用于路由之间的导航。