Czy w ogóle jest przesyłanie danych jako parametru za pomocą router.navigate? Mam na myśli coś takiego jak ten przykład, jak widać trasa ma parametr danych, ale robiąc to nie działa:
this.router.navigate(["heroes"], {some-data: "othrData"})
ponieważ niektóre dane nie są prawidłowym parametrem. Jak mogę to zrobić? Nie chcę wysyłać parametru z queryParams.
angular
routing
angular-router
Motomine
źródło
źródło
Odpowiedzi:
W tym temacie jest wiele nieporozumień, ponieważ można to zrobić na wiele różnych sposobów.
Oto odpowiednie typy użyte na poniższych zrzutach ekranu:
1) Wymagane parametry routingu:
2) Parametry opcjonalne trasy:
3) Parametry zapytania o trasę:
4) Możesz użyć usługi do przekazywania danych z jednego komponentu do drugiego bez używania parametrów trasy.
Na przykład patrz: https://blogs.msmvps.com/deborahk/build-a-simple-angular-service-to-share-data/
Mam plunker tego tutaj: https://plnkr.co/edit/KT4JLmpcwGBM2xdZQeI9?p=preview
źródło
route
typ toActivatedRoute
nieRouter
.W Angular 7.2.0 pojawiła się nowa metoda
https://angular.io/api/router/NavigationExtras#state
Wysłać:
Odbierz:
Tutaj możesz znaleźć dodatkowe informacje:
https://github.com/angular/angular/pull/27198
Powyższy link zawiera ten przykład, co może być przydatne: https://stackblitz.com/edit/angular-bupuzn
źródło
ngOnInit()
this.router.getCurrentNavigation().extras
Najnowsza wersja angular (7.2 +) ma teraz opcję przekazywania dodatkowych informacji za pomocą NavigationExtras .
Komponent domowy
newComponent
Wynik
Mam nadzieję, że to pomoże!
źródło
@ dev-nish Twój kod działa z niewielkimi poprawkami. Zrób
w
wtedy jeśli chcesz konkretnie wysłać typ danych, na przykład JSON w wyniku wypełnienia formularza, możesz przesłać dane w taki sam sposób, jak wyjaśniono wcześniej.
źródło
W navigateExtra możemy przekazać tylko jakąś konkretną nazwę jako argument, w przeciwnym razie pokazuje błąd jak poniżej: Dla Ex- Tutaj chcę przekazać klucz klienta w nawigacji routera i przekazuję w ten sposób-
ale pokazuje błąd, jak poniżej:
.
Rozwiązanie: musimy napisać tak:
źródło
Najlepsze, jakie znalazłem w internecie, to ngx-navigation-with-data . Jest to bardzo proste i dobre do nawigacji danych z jednego komponentu do drugiego. Musisz po prostu zaimportować klasę komponentów i używać jej w bardzo prosty sposób. Załóżmy, że masz dom i komponent, a następnie chcesz wysłać dane
KOMPONENT DOMOWY
O KOMPONENTACH
W przypadku każdego zapytania postępuj zgodnie z https://www.npmjs.com/package/ngx-navigation-with-data
Skomentuj, aby uzyskać pomoc.
źródło