應用下決心根組件在Angular2

Question

在Angular2我們可以使用Resolve如下：

import { UserResolver } from './resolvers/user.resolver.ts'; 

export const routes: RouterConfig = [ 
    { 
    path: 'users/:id', 
    component: UserComponent, 
    resolve: { 
     transaction: UserResolver 
    } 
    } 
]; 

但我如何能夠最好地應用解析器上運行，例如，我的app.component.ts？也許當網站第一次加載時，無論什麼頁面首次加載，我總是需要首先獲取用戶數據（例如）。那麼我怎樣才能讓這個解析器在路由層次上更低？

Answer 1

我一直在想同樣的事情。

原來，如果對站點的初始請求是針對其某個組件被某個分解保護的路徑，則該分解將在樹中的任何組件實例化之前運行。包括AppComponent。

現在的問題是AppComponent本身不是一個路由組件，因此它不能訪問解析的數據。也許你可以注入ActivatedRoute到AppComponent並通過當前路線的children訪問數據，但它看起來很駭人聽聞。

我通常會在我的路由層次結構的根目錄下設置一個解析（或CanActivate guard）以獲取該初始數據。數據本身由服務返回，幷包裝在ReplaySubject中。這保證1）數據將在所有用戶之間共享; 2）獲取數據的代碼只能執行一次。

換句話說：

• 我使用觀察到一次獲取異步數據，並在需要的我的應用的各個部分之間共享。
• 我依靠路由系統在應用生命週期中儘早觸發該observable的執行。

（但我不會使用路由系統來獲取數據並共享。）

更新回答的評論：

你必須引入一個虛擬的父母路線支持保護，例如：

const routes: Routes = [ 
    { 
    path: '', // This is the "root route" 
    component: PageShellComponent, 
    canActivate: [AuthGuard], 
    children: [ 
     { path: 'home', component: PageHomeComponent }, 
     { path: 'inbox', component: PageInboxComponent }, 
     { path: 'settings', component: PageSettingsComponent } 
    ] 
    }, 
]; 

父路徑是和它的護衛AuthGuard「我的路線層次的根」對於所有柒被執行d路由在應用程序中。如您所見，父路由具有空路徑，並且PageShellComponent的模板僅包含<router-outlet></router-outlet>。這條路線的唯一目的是支持警衛隊。

我應該加上它不覺得很習慣，我不確定這是最好的方式去。