2016-04-13 10 views
8

Powiedz, że mam trasę z takim parametrem (w Angular 2): /user1/products/:id, który może mieć ścieżki podrzędne, takie jak /user1/products/3/reviews.kątowa 2 trasa do strony 404, gdy parametr trasy jest niepoprawny

Kiedy nawiguję do , sprawdzam na moim serwerze i jeśli produkt nie istnieje, chcę renderować stronę 404 bez wpływu na historię przeglądarki.

Wydaje się nie działać, ponieważ dodaje zarówno /user1/products/-1 i /404 do historii przeglądarki

Czyli po naciśnięciu przycisku Powrót w przeglądarce, wracam do /user1/products/-1 który natychmiast przekierowany do /404 a ja zasadniczo tkwi w /404.

W ExpressJS wykonalibyśmy coś w rodzaju next(), aby przekazać żądanie do naszego programu obsługi 404. Czy w Angular 2 istnieje odpowiednik po stronie klienta?

+0

Zobacz również http://stackoverflow.com/questions/34227194/ handling-404-with-angleular2 –

Odpowiedz

6

Aktualizacja

W nowym routerem V3 można wykorzystać strażników jak wyjaśniono w https://angular.io/guide/router#canactivate-requiring-authentication

Original

myślę, że należy użyć @CanActivate() zrobić czek. Jeśli naprzód w @CanActivate() nieważne URL nie powinny być dodawane do historii (nie próbowałem)

Zobacz także https://github.com/angular/angular/issues/4112 do sposobu korzystania DI w @CanActivate()

+0

Dzięki za link, wstrzyknąłem router do '@CanActivate()', ale wygląda na to, że 'router.navigate' przesuwa się do historii po przejściu do nieprawidłowej strony bezpośrednio przez adres przeglądarki pasek, powodując ** Wstecz ** bu funkcja tton do zerwania. – Simonxca

+0

Rozumiem.Innym pomysłem byłoby użycie niestandardowego '' nie próbowałem tego sam. Wydaje mi się, że napisałem jakiś przykładowy kod ostatnio (nie mój) hete na SO –

+1

Zapytałem kątowych gości. Możemy użyć 'router.navigateByUrl (url, true)' w haku '@CanActivate()', aby rozwiązać ten problem. – Simonxca

0

jej naprawdę interesujące pytanie, być może należy to zgłosić jako funkcja żądanie. Byłoby mi miło mieć dostęp do instrukcji routera wewnątrz wywołania zwrotnego RouteDefinition loader.

Możesz spróbować emulować sprawdzanie poprawności dodając domyślną trasę /** i używając parametru RouteDefinition regex, aby dopasować tylko liczby dodatnie.

3

OK, jest już zaimplementowana, ale nie jest dobrze udokumentowana.

Zgodnie z docs:
router.navigateByUrl(url: string, _skipLocationChange?: boolean) : Promise<any>

Ma _skipLocationChange parametru że nie będą modyfikować historię.
Będą rade:

router.navigateByUrl('/404', true); router.navigateByInstruction(router.generate(['/404']), true);

3

Jak kątowego 2 końcowy jest to rozwiązanie:

this._router.navigateByUrl('/404', { skipLocationChange: true })