Angular2路由通過每個url登錄

在我們的應用中，我們有多個路由定義。我認爲我們搞砸了一些東西。 我們無法手動編寫url並獲取要加載的正確組件。我們每次都重定向到/ login，然後在用戶登錄後重定向回/賬戶。Angular2路由通過每個url登錄

您是否看到我們的路由有一些可能的改進？我猜這不是很有效率，而且「製作精良」。我們通過自己的路由路徑燒燬了大腦，並欣賞外部觀點。

祕密是我們的核心應用程序，我們只需向用戶顯示一個祕密請求表單。

例如，試圖訪問/帳號/祕密/重定向方面我們登錄然後回到帳戶，因爲用戶正在登錄...

這是我們的路線：

app.routing.ts

import { ModuleWithProviders } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 

import { LoginComponent } from './login/login.component'; 
import { AccountComponent } from './account/account.component'; 

import { accountRoutes } from './account/account.routes'; 
import { CanActivateViaAuthGuard } from './login/services/auth-guard.service'; 

const appRoutes: Routes = [ 
    { path: '', component: LoginComponent }, 
    { path: 'login', component: LoginComponent }, 
    { 
    path: 'account', 
    component: AccountComponent, 
    canActivate: [CanActivateViaAuthGuard], 
    children: accountRoutes 
    }, 

    // otherwise redirect to home 
    { path: '**', redirectTo: '/' } 
]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

第一側問題：在''路線上，我們是否應該重定向到登錄，而不是直接調用LoginComponent？

./account/account-routes.ts

import { Routes } from '@angular/router'; 

import { DashboardComponent } from './dashboard.component'; 
import { SecretComponent } from './secret/secret.component'; 

import { secretRoutes } from './secret/secret.routes'; 

export const accountRoutes: Routes = [ 
    { path: '', component: DashboardComponent }, 
    { path: 'secret', component: SecretComponent, children: secretRoutes }, 

    // otherwise call DashboardComponent 
    { path: '**', component: DashboardComponent } 
];

最後，

帳戶/祕密/ secret.routes.ts：

import { Routes } from '@angular/router'; 
import { SecretFormComponent } from './secret-form.component'; 
import { SecretTermsComponent } from './secret-terms.component'; 
import { TermsGuard } from './services/terms-guard.service'; 

export const secretRoutes: Routes = [ 
    { 
    path: '', 
    redirectTo: 'form' 
    }, 
    { 
    path: 'form', 
    component: SecretFormComponent, 
    canActivate: [TermsGuard] 
    }, 
    { path: 'terms', component: SecretTermsComponent } 

    // otherwise redirect to form 
    { path: '**', redirectTo: 'form' } 
];

來源

2016-12-05 BlackHoleGalaxy

最有可能您的問題是由於您使用默認的PathLocationStrategy而導致。因此，當您在瀏覽器的地址欄中輸入路由的直接URL時，它仍會向服務器發出請求，但無法找到在路由時命名的資源（並且正確）。只要找不到資源，服務器可能被配置爲重定向到主頁。

如果您切換到HashLocationStrategy，則不會向服務器發送任何請求，並且可以在瀏覽器中輸入直接路由URL。

只需添加到您的@NgModule註釋：

providers:[{provide: LocationStrategy, useClass: HashLocationStrategy}]

來源

2016-12-05 20:13:36

我只是嘗試這樣做，並導航到'/＃/帳號/祕密/ terms'重定向我'＃/ login'然後'＃/ account' 。所以我有與哈希相同的問題。我在本地主機上運行，並通過部署在heroku上給出了相同的結果。 – BlackHoleGalaxy

Angular2路由通過每個url登錄

回答

相關問題