Angular2 router VS ui-router-ng2 VS ngrx router

Question

Was sind die Vor- und Nachteile der Verwendung von ui-router-ng2 anstelle des neuen Angular2-Routers? In der Vergangenheit habe ich den ui-Router mit Angular 1.x anstelle von ngRoute benutzt, weil ich bessere Unterstützung für verschachtelte Zustände/Routen benötige.

Also, was ist mit Angular2? Ich würde gerne von Ihnen hören, damit ich beide Möglichkeiten bewerten kann.

Außerdem Suche und Suche auf Google fand ich ngrx/router, die ich nicht kannte. Können Sie mir sagen, was sind die Unterschiede zwischen dem eingebauten Router von Angular2, dem neuen UI-Router für Angular2 und ngrx Router?

Answer 1

Allgemeine Informationen

NGRX Strecke rdocs

NGRX Router Veraltete! Es gibt migration strategy von ngrx Router zum Standard Angular2 Router.

Angular2 Routerdocs

1. Standardlösung von Angular Team
2. Wurde von UI-Router von AngularJS inspiriert
3. für Komponenten Errichtet

Angular2 Router fast alle haben UI-Router-Funktionen.

NG2 UI-Routerdocs

Bekannte UI-Router von AngularJS für die Angular2 aktualisiert. Von den bekannten Vorteilen - macht reibungslosere Aktualisierung von AngularJS UI-Router zu ng2 UI-Router.

Vergleich Lassen Sie sich Syntax von UI-Router Router beiden Versionen mit Angular2 vergleichen.

AngularJS UI-Router:

app.config(function($stateProvider){ 
    $stateProvider.state('home', { 
     url: '/home', 
     templateUrl: 'home.html', 
     controller: 'HomeCtrl' 
    }) 
}); 

Angular2 UI-Router:

export let state1: Ng2StateDeclaration = { 
    name: 'home', 
    component: HomeComponent, 
    url: '/home' 
} 

@NgModule({ 
imports: [ 
    SharedModule, 
    UIRouterModule.forChild({ states: [home] }) 
], 
declarations: [HomeComponent] 
}) 
export class MyModule {} 

Angular2 Router:

(Update: Eigenschaft - name wurde nach V3-alpha7 entfernt. Weil es mit dem langsamen Laden von Routen nicht geklappt hat.)

import { 
    RouteConfig, 
    Route 
} from 'angular2/router'; 
import {HomeComponent} from './components/home'; 

@Component({}) 
@RouteConfig([ 
    new Route({ 
     path: '/home', 
     component: HomeComponent, 
     name: 'Home' // Deprecated property, works until v3-alpha7 
    }) 
]) 
export class App {...} 

Wie wir sehen können, ist im Allgemeinen Angular2 Router ziemlich gleich. Als Ergänzung müssen sagen, dass es die meisten gängigen Funktionen wie statische/dynamische gemeinsamen Nutzung von Daten durch die Routen, verschachtelte Ansichten usw.

• Gleiche Standortstrategien (Pfad und Hash)
• ähnliche Route Definitionen
unterstützt
• Ähnliche Dienste:
  • $ state.go und Router.navigate
  • $ stateParams und RouteParams
  • $ state.current.data und Routedata
• ähnliche Richtlinien
  • ui-Ansicht und Router-Ausgang
  • ui-Sref und Router

Fazit

Angular2 Router Beste UI- genommen hatte Router Erfahrung und implementiert es. Wenn Sie Ihre Code-Basis mit AngularJS UI-Router auf Angular2 schnell und reibungslos migrieren möchten, können Sie Ng2 UI-Router ausprobieren, sonst würde ich denken, dass Angular2 Router am besten passt. Selbst wenn Sie sich für den NG2 UI-Router entschieden haben, sollten Sie alle Vor- und Nachteile prüfen. Momentan habe ich das Gefühl, dass die Community eine Standardlösung des Angular-Teams wählen wird, was besseren Support bedeutet.