我有一个angular应用程序,其中我使用相同的组件来创建和更新我的数据库的对象。从寄存器列表(在complaints
下),我可以导航到现有的记录(在complaints/detail/id
下)或创建一个新的记录(在complaints/detail
下)。当我创建一个新的注册表时,我希望保留在相同的组件中(这样它就不会被销毁并重新创建,并且用户看不到任何闪存),但是URL应该更新以反映新创建的项的Id (从complaints/detail
到complaints/detail/id
)。
我应该如何在模块中指定路由,以及如何从创建页面导航到编辑页面?
发布于 2019-06-20 04:51:36
我的Example。
在路由中,只指向组件一次,以避免重新创建:
{
path: 'data',
redirectTo: 'data/'
},
{
path: 'data/:id',
component: CreateAndEditComponent
}
在组件中观察参数的变化:
ngOnInit() {
console.log('init');
const getParams = () => {
const dataId = this.route.snapshot.paramMap.get('id');
this.data = dataId.length > 0 ? this.getDataById(dataId) : new Data();
};
this.router.events.pipe(takeUntil(this._destroyed)).subscribe(event => {
// only listen for NavigationEnd as that indicates navigation processing is complete
if (event instanceof NavigationEnd) {
// get params for each consecutive route
getParams();
}
});
// get params for initial route
getParams();
}
save() {
this.service.saveData(this.data);
this.router.navigate(['/data', this.data.id]);
}
https://stackoverflow.com/questions/56672858
复制相似问题