在初始化應用程序之前角度4加載數據

我想在我的應用程序啓動之前加載一些數據。我之所以需要這樣做，是因爲某些菜單基於某些用戶條件限制了訪問，例如基於用戶位置。在初始化應用程序之前角度4加載數據

因此，如果用戶還沒有位置或它的位置未啓用訪問某個視圖，我需要阻止它。

我試着用角度解決方法，都沒有成功，這是我做的：

解決後衛

// The apiService is my own service to make http calls to the server. 
@Injectable() 
export class AppResolveGuard implements Resolve<any> { 
    constructor(
     private _api: ApiService, 
     private _store: Store<IStoreInterface>, 
    ) { } 

    resolve(): any { 
     return this._api.apiGet('loadData').subscribe(response => { 
      this._store.dispatch({ 
       type: USER_FETCH_DATA, 
       payload: response.usuario 
      }); 

      return response; 
     }); 
    } 
}

路由

export const routing = [ 
    { 
     path: '', component: AppComponent, canActivateChild: [AuthGuard], resolve: {app: AppResolveGuard}, 
     children: [ 
      { path: 'home', component: HomeComponent }, 
      { path: 'company', canActivate: [LocationGuard], component: CompanyComponent }, 
     ] 
    } 
];

AuthGuard正在檢查一個有效的cookie會話。

正如您所看到的，我試圖阻止訪問的路由是company路由。當我第一次加載另一個頁面時，我可以阻止訪問，例如，如果第一次訪問是頁面home，然後導航到頁面company，驗證工作正常，因爲用戶數據和位置已經可用。

但是，如果第一次訪問頁面company，它將阻止所有用戶在那裏導航，因爲在LocationGuard嘗試驗證用戶位置時，數據還不可用。

我也嘗試用CanActivate替換Resolve，但它在數據可用後從不啓用視圖，它保留在空白頁上。

來源

2017-08-09 celsomtrindade

嘗試查找此https：// stackoverflow。com/a/45204693/415078基本上你可以在啓動AppModule之前調用你的API，然後你可以在你的守衛中傳遞/訪問這些數據 – Kuncevic

@Kuncevic不能用角度路由器解決它？因爲它都與商店等鏈接。 – celsomtrindade

然後聽起來像你不能做應用程序初始化之前，因爲你依靠商店，等 – Kuncevic

一些東西......

預取的數據是一個偉大的使用旋轉變壓器。

防止訪問路線是CanActivate的一大亮點。

但是請注意，解析器僅在檢查完所有警衛之後起作用。因此，您的代碼將嘗試在運行解析器之前運行CanActivate 之前。

來源

2017-08-09 00:58:05 DeborahK

嗡嗡聲..所以去與canActivate（就像我在這裏評論我自己的答案）是要走的路？ – celsomtrindade

我不太瞭解你的要求。但一種選擇是將決定添加到父路由和canActivate到子路由。這樣，解決方案應該在孩子的canActivate運行之前執行。 – DeborahK

我在this question找到了解決方法。

我找到了一種使用方法canActivate。我已經嘗試使用.map()來返回Observable，但關鍵點是.first()最後，這是解決了這個問題。

我會保持開放壽，因爲如果有一種方法可以使用Resolve實現相同的結果，也許它會更好。頁面加載之前

來源

2017-08-09 00:57:48 celsomtrindade

在初始化應用程序之前角度4加載數據

回答

相關問題