Routing Nasıl Oluşturulur ?

Lazy-Loaded Oluşturma

Yeni eklenecek bir componentin routinglerinin de otomatik olarak oluşturulmasını sağlar.

Eklenecek klasöre sağ tık yapılıp Generate a new module seçeneği seçilir acılan kutucuğa modüle ismi verilir ve enter ile onayladıktan sonra Lazy-loaded module of pages seçeneği seçilir. Rotuting ile ilgili kodlar kendiliğinden eklenmiş olur. Bu işlemden sonra app-routing.module.ts dosyasını açıp yeni eklenen komponentin routing kodunu bulunup ilgili kod oradan kesildikten sonra yine app-routing.module.ts dosyasında bulunan IsletmeUrlOnEk kısmmına kod yapıştırılmalıdır

El ile Roting Oluşturma

app-routing.module.ts dosyası açılır

Örnek Kod

{
 path: "kod1tanim",
 loadChildren: () =>
   import("./views/pages/kod1tanim/kod1tanim.module").then(
     (m) => m.Kod1tanimModule
   ),
},

• path :tarayıcı url'ine yazılacak olan path yazılır
• import kısmınıa ilgili komponentin module dosyasının yolu yazılır.
• (m) => m. Kısmının sonuna ilgili komponentin modül ismi yazılır.

Daha sonra routing vermek istediğimiz komponentin modül dosyası açılıp içersine;

import { Routes, RouterModule } from "@angular/router";

import kodunu altına ;

const routes: Routes = [
  {
    path: '',
    component: KomponentinAdi,
  },
];

imports kısmına da;

RouterModule.forChild(routes);

Eklenmelidir.

Routing Parametre Gönderimi

Örnek Kod

import { OctaPullRouterService } from '@alpata/octapull.core';

OctaPullRouterService constructor'dan enject edilir

constructor(
  public octaPullRouter: OctaPullRouterService
) {}

sonrasında html tarafından kullanılabilir

<button
  (click)="octaPullRouter.navigate(['/stokkayit/' + item.Id ], { queryParams: { onaybekleyen: 'true' }, queryParamsHandling: 'merge' })"
  type="button"
  class="btn btn-success btn-sm"
>
  Onayla
</button>

Yukarıdaki kod bloğu buton tıklandığında stokkayit sayfasına ilgili verini id sini alarak gider ayrıca beraberinde onaybekleyen:'true' değerinide götürür Örnek kod da buluan yerler değiştirilerek componenlerde kullanılabilir. octaPullRouter'ı kullanmak için ilgili componentin constructor kısmına ts public octaPullRouter: OctaPullRouterService, bu şekilde eklenebilir.

Harici olarak router service kullanılarak ta routing oluşturulabilir.