Mi az a bootstrap router?
Az Angular „bootstrap” csomagja megvalósítja azokat az útválasztó képességeket, amelyek lehetővé teszik az alkalmazásnézetek közötti navigációt, amikor az URL megváltozik. Az AngularJS felhasználók az Angular útválasztást nagyon hasonlónak találják az AngularJS útválasztóhoz.
Az egyik fő különbség azonban az, hogy az Angular elnevezett URL-útvonalakat használ a hash-útvonalak helyett. Ez azt jelenti, hogy ahelyett, hogy „#” jelet használna az URL-ben, az Angular „/” jelet használ az útvonal kezdetének kijelölésére. Például a következő egy példa az Angular router URL-jére, amely elnevezett útvonalakat használ:
`https://www.example.com/home`
Ez az URL a szögalkalmazásban található „home” nevű összetevőre navigálna.
Kezdő lépések az Angular Routerrel
Az Angular router használatának megkezdéséhez importálnia kell a "RouterModule"-t a "@angular/router" modulból. Ezután a "RouterModule.forRoot()" metódust kell használnia az alkalmazás útvonalainak konfigurálásához. A `RouterModule.forRoot()` metódus `Route` objektumok tömbjét veszi fel. Az "Útvonal" objektum a következő tulajdonságokkal rendelkezik:
- útvonal :Az az URL-minta, amelyhez ez az útvonal illeszkedik.
- komponens :Az az összetevő, amelyet ennek az útvonalnak be kell töltenie, ha az URL megegyezik az elérési úttal.
- gyerekek :Gyermekútvonalak tömbje, amelyek ezen az útvonalon lehetnek.
- Activate :Védők egy sora, amelyen át kell haladni az útvonal betöltése előtt.
A következő példa egy egyszerű szögletes útválasztó konfigurációra:
``` gépirat
import { RouterModule, Routes } innen:'@angular/router';
const routes:Routes =[
{ elérési út:'home', összetevő:HomeComponent },
{ elérési út:'about', összetevő:AboutComponent },
];
@NgModule({
importál:[RouterModule.forRoot(routes)],
exportál:[RouterModule]
})
Export osztály AppRoutingModule { }
```
Ez a konfiguráció két útvonalat határoz meg, egyet az otthoni összetevőhöz, egyet pedig az about összetevőhöz. Ha az URL megegyezik az útvonal elérési útjával, az útválasztó betölti a kapcsolódó összetevőt.
Az Angular Router további szolgáltatásai
Az Angular router számos további funkciót kínál, többek között:
- Lásta betöltés :Az Angular routerrel lustán lehet betölteni az alkatrészeket, ami azt jelenti, hogy csak akkor töltődik be, amikor szükség van rájuk. Ez javíthatja az alkalmazás teljesítményét azáltal, hogy csökkenti a kezdeti betöltési időt.
- Őrök :Az őrök olyan funkciók, amelyek segítségével megakadályozható az útvonal betöltése. Ez hasznos lehet például hitelesítési célokra.
- Megoldók :A feloldók olyan funkciók, amelyek segítségével lekérhetők az adatok az útvonal betöltése előtt. Ez hasznos lehet az összetevő számára szükséges adatok előzetes lekéréséhez.
- Gyermekútvonalak :A gyermekútvonalak olyan útvonalak, amelyek más útvonalakba ágyazhatók. Ez hasznos lehet az alkalmazás különböző szakaszokba rendezéséhez.
- Útvonalparaméterek :Az útvonalparaméterek használhatók adatok komponensek közötti továbbítására. Ez akkor lehet hasznos, ha adatokat továbbít egy útvonal által betöltött összetevőnek.
- Lekérdezési paraméterek :Lekérdezési paraméterek használhatók adatok átadására egy útvonalnak. Ez hasznos lehet az adatok szűréséhez vagy adatok továbbításához egy útvonal által betöltött összetevőhöz.
Az Angular routerrel kapcsolatos további információkért tekintse meg a hivatalos dokumentációt.