webentwicklung-frage-antwort-db.com.de

Angular: Verwendung von forRoot/forChild-Methoden?

Ich war überrascht, dass es keine genaue Antwort auf die Frage gibt:

Wofür werden die Methoden forRoot / forChild gemacht?

Zum Beispiel in RouterModule:

Router.forRoot(routes)
6
Stepan Suvorov

forRoot ()

Erzeugt ein Modul mit allen Router-Providern und richtlinien. Optional kann ein Anwendungslistener auf .__ eingerichtet werden. führen Sie eine erste Navigation durch.

forChild () 

Erzeugt ein Modul mit allen Router-Anweisungen und einem Anbieter Registrierung der Routen.

Verwenden Sie die forRoot-/forChild-Konvention nur für gemeinsam genutzte Module mit Providern, die sowohl in Modulen als auch in Lazy-Modulen importiert werden

Vermeidung allgemeiner Verwirrungen mit Modulen in Angular

dies ist eine großartige Antwort Was ist der Zweck von forRoot in NgModule? kann zusätzliche Informationen zu diesem Thema geben 

2
malbarmawi

Verwendungshinweise

Das RouterModule kann mehrmals importiert werden: einmal pro träge geladenem Bundle. Da der Router mit einem global gemeinsam genutzten Ressourcenstandort arbeitet, können nicht mehr als ein Routerdienst aktiv sein.

Deshalb gibt es zwei Möglichkeiten , um das Modul zu erstellen: 

1. RouterModule.forRoot - forRoot erstellt ein Modul, das alle Anweisungen, die angegebenen Routen und den Routerdienst selbst enthält.

2. RouterModule.forChild - forChild erstellt ein Modul, das alle Anweisungen und die angegebenen Routen enthält, nicht jedoch den Routerdienst.

1
James Delaney

RouterModule # forRoot

Erzeugt ein Modul mit allen Router-Providern und Anweisungen. Es auch Richtet optional einen Anwendungslistener ein, um ein erstes .__ auszuführen. Navigation.

Während RouterModule # forChild

Erstellt ein Modul mit allen Router-Anweisungen und einem Provider Routen registrieren.

Die erste wird normalerweise verwendet, um die ursprüngliche Konfiguration für die App Angular zu erstellen und die "Basis" -Routen zu registrieren, während die Zweite normalerweise zum Konfigurieren von "relativen" Routen verwendet wird.

Nehmen wir an, wir haben eine App mit Routen für:

  1. Nutzer
    • Registrieren
    • Liste
    • Löschen
  2. Unternehmen
    • Registrieren
    • Liste
    • Löschen

Sie können die genannten Methoden wie folgt verwenden:

app-routing.module.ts (Dies ist eine "echte" App, die Routen unterscheiden sich.)

Wo die Basisrouten user/ und company/ mit RouterModule#forRoot registriert werden

//...
const  routes: Routes = [
  {
    path: 'user', loadChildren: './user/user.module#userModule'
  },
  { path: 'company', loadChildren: './company/company.module#CompanyModule'},
  { path: '**', loadChildren: './page-not-found/page-not-found.module#PageNotFoundModule'}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }
//...

user-routing.module.ts (Dies ist eine "echte" App, die Routen unterscheiden sich.)

Die relativen Routen zu user/ und company/ werden mit RouterModule#forChild registriert.

//...
const routes: Routes = [
  { path: 'list', component: UserComponent},
  { path: 'delete/:id', component: UserDeleteComponent},
  { path: 'register/:id', component: UserRegisterComponent},
];

@NgModule({
  imports: [ RouterModule.forChild(routes) ],
  exports: [ RouterModule ]
})

//...

Dasselbe würde für die Kinderrouten der Firma weitergehen.

1
lealceldeiro