我在我的角度專案中使用輔助插座。
在我的routing.module.ts我有：
路由.module.ts
const routes: Routes = [
{
path: '',
component: XXXComponet,
},
{
path: 'home',
component: YYYComponet,
},
{
path: 'file-viewer',
outlet: 'secondary',
loadChildren: () => import('../../other/app/other.app.module').then((m) => m.OtherAppModule),
},
{path: '**', canActivate: [AuthGuard], component: PageNotFoundComponent},
我已經宣告(secondary:file-viewer)我希望我的路線other.module被加載。同樣在我的app.html我有這個：
應用程式.html：
<div id="main-content-container">
<router-outlet></router-outlet>
</div>
<router-outlet name="secondary"></router-outlet>
在我的other.module檔案中，我宣告了這個路由：
其他.模塊：
{
path: 'image-viewer',
component: ImageViewerComponent,
},
{
path: '',
component: AppComponent,
children: [
{
path: 'search',
component: AAAComponent,
children: [
{
path: 'result',
component: BBBViewComponent,
data: {needConnections: true},
},
{
path: '',
component: CCCViewComponent,
data: {needConnections: true},
},
],
},
{
path: 'explorer',
component: FFFViewComponent,
data: {needConnections: true},
},
{
path: 'reporter',
component: GGGViewComponent,
},
{
path: 'datasets',
component:KKKViewerComponent,
}]
}
現在，讓我告訴你這是怎么一回事：我正在嘗試創建一個檔案查看器庫。它將從我專案的幾個方面呼叫。所以我決定在我的專案中使用輔助路由。所以每當我想要打開我的檔案查看器時，我都會：
await this.router.navigate(['', {outlets: {secondary: 'other-file-viewer/image-viewer'}}]);
它會為我打開它。
我也傳遞skipLocationChange: true給它，所以用戶不會注意到 url 的變化。還有一些查詢引數。
await this.router.navigate(['', {outlets: {secondary: 'other-file-viewer/image-viewer'}}], {
skipLocationChange: true,
queryParams: {
id: params.fileId,
src: this.getDownloadStreamLink(params.fileId),
},
});
所以基本上當用戶點擊一個按鈕時， url 會從\xx\explorer變為xx\explorer(secondary:file-viewer/image-viewer)。
它正在作業。當我單擊按鈕時，我的組件會打開。問題是它還重繪 了我在頁面上已有的內容。它基本上也重繪 了我的主要出口。
我怎樣才能避免這種情況？
任何建議表示贊賞。
uj5u.com熱心網友回復：
不是角度問題。我把自己搞砸了。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/476171.html