角度路由问题：新页面显示在旧页面下方

Question

然而，我正在尝试导航到我的角度应用程序中的新页面。我创建的新页面显示在我的主页下方，即 app.component.ts

这是我的路由

const routes: Routes = [
  { path: '', redirectTo: 'billing-cycle', pathMatch: 'full' },
  { path: 'billing-cycle', component:  AppComponent},
  { path: 'customer-account-docs', component: CustomerAccountDocsComponent }
];

这是我的路由器链接

 <a routerLink='/customer-account-docs'>{{msgFound.value}}</a>

Answer 1

发生这种情况是因为您添加了代码，可能如下所示

应用程序组件.html

<div>

.....<!-- Your other HTML code -->

</div>

<router-outlet></router-outlet> <!-- Your new page loaded here -->

因此，当您加载页面时，该页面会加载您的router-outlet标签定义的位置

所以我的建议是，不要在该router-outlet位置添加其他代码。

希望这会有所帮助！