我想渲染 2 個組件（AppComponent和UserComponent）而不必始終渲染 AppComponent 。這是我的代碼的樣子：
app.routing.module.ts
const routes: Routes = [
{
path: '', component: AppComponent
},
{
path: 'user', component: UserComponent
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
應用程式組件.html
<div>
I'm in the app component
</div>
<router-outlet></router-outlet>
現在由于某種原因“我在應用程式組件中”文本被渲染了 2 次，如圖所示：
現在，當我轉到路線“/用戶”時，我看到了：
所以我的問題是，當我在“/”路線上時，我怎樣才能看到“我在應用程式組件中”的文字，而當我在“/用戶”路線上時，我只能看到“用戶作業！” ? 非常感謝！
uj5u.com熱心網友回復：
我的回答是：不要。創建一個OtherComponent，然后<router-outlet>從AppComponent.html 中洗掉除標記之外的所有內容。
將該 AppComponent 視為所有內容流經的頂級。Angular 非常固執己見，如果你以一種非標準實踐的方式做事，Angular 就會表現得像它應該做的那樣。
如果這兩個分支真的應該分開，請考慮使用單獨的應用程式。
uj5u.com熱心網友回復：
這是因為默認路由''與''和'user'路徑都匹配。嘗試設定pathMatch: 'full'為AppComponent，它不應該在其他路由上呈現：
{
path: '',
component: AppComponent
pathMatch: 'full'
}
但這里更多的問題是默認路由應該是一個單獨的組件，而你的AppComponent應該是保存router-outlet.
uj5u.com熱心網友回復：
您需要從路由中洗掉 AppComponent。
const routes: Routes = [
{
path: 'user', component: UserComponent
}
];
AppComponent 默認呈現。這是相同的堆疊閃電戰。
https://stackblitz.com/edit/angular-ivy-nivcaf?file=src/app/app.component.ts
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/370073.html
標籤：javascript 有角的 打字稿
上一篇：輸入'{'x-access-token'：任意；}|{'x-access-token'？：未定義；}'不可分配到型別'AxiosR