角度2初次路由之前調用初始函數

Question

我有一個應用程序，在實際加載應用程序之前，我想從服務器加載所有消息。

我已經把http請求放入我的應用程序組件中的OnInit。

但我沒有辦法讓路由在獲取第一頁之前「等待」，並且應用程序以空信息開始。

任何方式來做到這一點？

Answer 1

可以使用APP_INITIALIZER此：

添加到您的AppModule的供應商陣列：

{provide: APP_INITIALIZER, useFactory: appInitFactory, deps: [MsgLoader], multi: true} 

然後創建一個函數工廠，獲得您的郵件。這應返回箭頭函數返回的實際Promise：

export function appInitFactory(msg: MsgLoader):() => Promise<any> { 
    return() => msg.loadMessages(); 
} 

如果你不介意的AppComponent負載，而是被裝入其子頁面做主意，你可以使用initialNavigation財產上的根路由：

RouterModule.forRoot(AppRoutes, {initialNavigation: false}) 

這可以防止加載第一個模塊。你應該然而，有一些服務注入到你的AppComponent它處理你的信息的加載，然後路由到所需的模塊

Answer 2

一個簡單的辦法：

當你定義你的路由，添加prehome頁面和PreHomeComponent：

imports: [ 
     RouterModule.forRoot([ 
      { path: '', redirectTo: 'prehome', pathMatch: 'full' }, 
      { path: 'prehome', component: PreHomeComponent }, 
      { path: 'home', component: HomeComponent }, 
      { path: 'counter', component: CounterComponent }, 
      { path: 'fetch-data', component: FetchDataComponent }, 
      { path: "job/:id", component: JobComponent }, 
      { path: '**', redirectTo: 'prehome' } 
     ]), 
     MaterialModule 
    ]  

在

您PreHomeComponent從服務器加載您所需的信息，然後重定向到home。