角的路径构造

Question

我正在使用Angular 8和Django3。我不了解在Angular中构建URL路径的方式。我在restaurantlist中有一个restaurantdetail组件和一个app-routing-module.ts组件，其路径如下：

const routes: Routes = [
  {path:'restaurantlist', component:RestaurantlistComponent},
  {path:'restaurantdetail/:id', component:RestaurantViewComponent}
];

在我的restaurantlist.component.html文件中：

<h2>List of Restaurants</h2>
<ul *ngFor = "let restaurant of restaurants">
<a [routerLink]="['restaurantdetail', restaurant.id]">{{restaurant.name}}</a>  
</ul>

[当我单击restaurant.component.html文件中的链接之一时，它试图发送给我的链接是localhost:4200\restaurantlist\restaurantdetail\2。我不想要这个，我希望它将我发送到localhost:4200\restaurantdetail\2，因为这是我设置Django URL的方式。为什么它继承了URL的restaurantlist部分（好像它是此组件的子视图或其他内容一样），又如何摆脱它呢？它与我如何定义指向restaurantlist组件的链接有关吗？

<a [routerLink]="'/restaurantlist'">See Available Restaurants</a>

感谢任何输入。

Answer 1

尝试在路线前添加'/'

<a [routerLink]="['/restaurantdetail', restaurant.id]">{{restaurant.name}}</a>

Answer 2

一条路线没有 /是一条相对路线，表示您“深入”到一条路线。

localhost / main->路由到list-> localhost / main / list->路由到detail-> localhost / main / list / detail

一条路线with /是一条绝对路线，表示您想精确地到达那里。

localhost / main->路由到/list-> localhost / list->路由到/detail-> localhost / detail。

如果您在列表页面上，可以转到detail，但是如果您在主页上并且想要详细说明，则必须使用/main/list/detail或list/detail。