angular2 RouteParams, Serialisierung und komplexe Objekte oder Arrays

Question

Ich versuche, ein Objekt als RouteParam

let params = { account: 'revenue', page: 3, conditions: [{foo: 'john'}, {foo: 'kelly'}] // <-- Complex object } this._router.navigate(['Journal', params])

passieren, aber ich bin eine URL wie

http://localhost:3000/journal/revenue/3?conditions=[object%20Object],[object%20Object]

IIRC bekommen, angular1 unterstützt diese Art der Serialisierung hin und her unter Verwendung von JQuerys $ .param (ich könnte falsch liegen)

Gibt es eine Möglichkeit, in angular2 ähnlich zu erreichen?

Answer 1

Da solche Parameter innerhalb der URL übergeben werden, könnten Sie sie als Zeichenfolge konvertieren, indem Sie beispielsweise JSON.stringify verwenden und sie in Objekt aus Route Params mit JSON.parse konvertieren, wenn Sie darauf zugreifen möchten.

let params = { 
    account: 'revenue', 
    page: 3, 
    conditions: JSON.stringify("[{foo: 'john'}, {foo: 'kelly'}]") 
}; 
this._router.navigate(['Journal', params]); 

und

constructor(params:RouteParams) { 
    var conditions = JSON.parse(params.get('conditions')); 
} 

Der andere Ansatz ist es, einen gemeinsamen Dienst zu nutzen. Sie setzen das Objekt in eine Eigenschaft dieses Dienstes, bevor Sie die Route aufrufen und von der Komponente abrufen, die der Route entspricht, nachdem sie aktiviert wurde. Sie können feststellen, dass ein gemeinsamer Dienst definiert werden muss, wenn die Anwendung Bootstrapping der Lage sein, eine einzelne Instanz für die gesamte Anwendung zu teilen:

bootstrap(AppComponent, [ SharedService ]); 

Sehen Sie diese Frage für weitere Informationen:

• Angular 2 passing object via route params possible?