Угловое 4: Передача объекта в Маршруты без обновления Параметр запроса

Я использую Angular 4, и я хочу передать некоторый объект маршрутизатору, но не обновляя параметры запроса.

user.component.ts

this.router.navigate(["/profile",{
   action: 'edit',
   user: {id: 1, name: 'test', email: '[email protected]'}
}]);

приложение-routing.module.ts

{ path: 'profile', component: UserProfileComponent }

пользовательский profile.component.ts

this.route.params.subscribe(params => {

});

Любая помощь?

Ответ 1

Ниже приведен пример совместного использования данных с помощью службы: http://blogs.msmvps.com/deborahk/build-a-simple-angular-service-to-share-data/.

Ответ 2

В последней версии angular 7.3 и выше методы маршрутизатора navigate и navigateByUrl принимают другой параметр с типом NavigationExtras, имеющий свойство, называемое состоянием, принимает объект, после того как мы установим значение состояния, мы можем получить значение в целевом компоненте. при доступе к объекту истории, так же, как это, мы передаем объект между маршрутами.

установить состояние

 const user = {id: 1 , name : '...' , address : {country: '...' , city : '...'}}
 this._router.navigate(['details',user.id] , {state:{...user} });

в компоненте детали мы можем получить доступ к значению состояния, как это

 this.user = window.history.state;

демонстрация стекаблиц 🚀🚀