Route Tanımlama

Uygulamayı Angular Router kullanacak şekilde kurduğunuza göre, artık rotaları tanımlamanız gerekiyor.

Bu aktivitede, uygulamanıza rotaları nasıl ekleyeceğinizi ve yapılandıracağınızı öğreneceksiniz.

1. app.routes.ts dosyasında bir rota tanımlayın

   Uygulamanızda gösterilecek iki sayfa vardır: (1) Ana Sayfa ve (2) Kullanıcı Sayfası.

   Bir rota tanımlamak için, app.routes.ts dosyasındaki routes dizisine aşağıdakileri içeren bir rota nesnesi ekleyin:

   • Rotanın path'i (otomatik olarak kök yoldan (yani /) başlar)
   • Rotanın göstermesini istediğiniz component

   import {Routes} from '@angular/router';
   import {Home} from './home/home';
   
   export const routes: Routes = [
     {
       path: '',
       component: Home,
     },
   ];

   Yukarıdaki kod, Home'un bir rota olarak nasıl eklenebileceğine dair bir örnektir. Şimdi devam edin ve bunu User ile birlikte oyun alanında uygulayın.

   User için yol olarak 'user' kullanın.

2. Rota tanımına başlık ekleyin

   Rotaları doğru şekilde tanımlamanın yanı sıra, Angular Router kullanıcılar navigasyon yaparken her rotaya title özelliği ekleyerek sayfa başlığını ayarlamanızı da sağlar.

   app.routes.ts dosyasında, varsayılan rota (path: '') ve user rotası için title özelliğini ekleyin. İşte bir örnek:

   import {Routes} from '@angular/router';
   import {Home} from './home/home';
   
   export const routes: Routes = [
     {
       path: '',
       title: 'App Home Page',
       component: Home,
     },
   ];

Bu aktivitede, Angular uygulamanızda rotaları nasıl tanımlayacağınızı ve yapılandıracağınızı öğrendiniz. Harika is. 🙌

Uygulamanızda yönlendirmeyi tamamen etkinleştirme yolculuğu neredeyse tamamlandı, devam edin.