2017-12-13 152 views
5

Mam konfigurację trasy skonfigurowaną przez @NgModule. I mam usługę, która identyfikuje, które części aplikacji powinny być pokazywane użytkownikowi w zależności od pewnych warunków. Muszę zadzwonić do tej usługi i ustawić trasy zgodnie z zwróconą wartością.Kątowa: konfiguruj trasy w zależności od metody usługi zadzwoń

Problem: konfiguracja trasy jest ustawiony wewnątrz adnotacji i nie mogę dostać jak wywołać usługę w takiej konfiguracji.

Aby być bardziej szczegółowym, tutaj jest przykładowa konfiguracja, którą chcę ulepszyć.

Moja obecna konfiguracja routingu:

const appRoutes: Routes = [ 
    { 
     path: '', 
     redirectTo: 'first-route', 
     pathMatch: 'full' 
    }, 
    { 
     path: 'first-route', 
     component: FirstComponent, 
     pathMatch: 'full' 
    }, 
    { 
     path: 'second-route', 
     component: SecondComponent, 
     pathMatch: 'full' 
    }, 
    ... 
]; 

@NgModule({ 
    imports: [RouterModule.forChild(appRoutes)], 
    exports: [RouterModule] 
}) 
export class MyRoutingModule { 
} 

usługę, należy zmienić konfigurację trasy:

@Injectable() 
export class MyService { 
    getAccessibleRoutes(): Observable<string[]> {...} 
} 

Pytanie: W jaki sposób można nawiązać połączenie usług i zmiany trasy?

Uwaga: Spojrzałem również na "Dynamically adding routes in Angular" i "How we can add new routes dynamically into RouterModule(@NgModule imports)", ale nie znalazłem tam jasnej odpowiedzi.

Odpowiedz

2

Jeśli poprawnie zrozumiałem Twój problem, prawdopodobnie myślę, że możesz rozważyć użycie straży drogowej, aby osiągnąć cel. Proponuję użyć funkcji strażników, aby określić warunki dostępu do twoich tras, zamiast zmieniać listę tras.

Proszę sprawdzić ten link, aby uzyskać więcej informacji na temat osłon trasy:

https://codecraft.tv/courses/angular/routing/router-guards/

Mam nadzieję, że to pomoże.

import { Injectable } from '@angular/core'; 
import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; 
import { YourSecurityService } from './your-security.service'; 

@Injectable() 
export class YourRouteGuardService implements CanActivate { 

    constructor(
     private router: Router, 
     private yourSecurityService: YourSecurityService) { 
    } 

    canActivate(
     route: ActivatedRouteSnapshot, 
     state: RouterStateSnapshot): boolean { 

     console.log(state.url); // HERE YOU CAN GET REQUESTED ROUTE 

     if (this.yourSecurityService.checkIfUserHaveAccess()) 
      return true; 

     this.router.navigate(['your-route-to-redirect']); 
     return false; 
    } 
} 

Następnie należy zastosować osłonę na trasie:

const appRoutes: Routes = [ 
    { 
     path: 'someroute', 
     component: RouteComponent, 
     canActivate: [YourRouteGuardService] 
    }, 
    ... 
] 
+0

Ho mogę ustawić 'redirectTo' ze strażników routerze? Na przykład, jeśli wiem, że 'pierwsza trasa' nie jest dostępna dla użytkownika, chciałbym zmienić przekierowanie na' drugą trasę'. –

+0

Proszę sprawdzić zaktualizowaną odpowiedź. Tutaj znajdziesz przykład, jak przekierować na inną trasę w straży, jeśli twój warunek aktywacji nie jest spełniony –

+0

@OleksandrShpota Wygląda na to, że twoim początkowym podejściem jest dynamiczna zmiana konfiguracji trasy w oparciu o logikę w aplikacji. Zgadzam się z Tarasem, że bardziej poprawne podejście polega na zdefiniowaniu całej konfiguracji routera z góry i użyciu funkcji Ochrona trasy w celu ograniczenia dostępności dla każdej trasy w oparciu o dane w aplikacji. Zobacz dokumentację kątową, aby uzyskać więcej informacji https://angular.io/guide/router # canload-guard-guarding-unsuthorized-loading-of-feature-modules – tt9