基于api上的数据导航到下一页,单击next按钮时,在页脚组件中,内容在中间并且是动态的。在下一次单击时,将使用不立即将数据发送到商店的效果来调度事件。select并针对已使用的订阅数据进行获取,但不是第一次从可观察的对象中获取最新的订阅数据。
我的代码看起来像这样,这里是stackblitz链接
https://stackblitz.com/edit/angular-b8lgts
下一步单击订阅从存储中获取数据的位置,然后在获取之前进行api调用以导航到哪个路由。因此next在所有组件中都是通用的,而不是在每个组件中都放置下一个。
因此,这里的每次下一次单击都是在公共页脚组件中,而不是每个页面中都有下一个。因此,在使用store.select订阅的同一组件中,它不会获得一次,因此它命中数字,因此需要放置许多条件。因此,在订阅中需要放置不同的条件,否则导航到错误的路线,因为如果使用订阅,则存储中会存在旧对象,因此每次更新都会命中
save(){
this.isCurrentPage = true;
this.cpCommonService.clearErrorDivs();
// this.spinner.show();
if(this.router.url === '/byh/member_details/member_ethnicity'){
this.ethnicityData();
}else if(this.router.url === '/byh/member_details/member_name'){
this.navigationPath.componentName = "member_name";
this.validateData();
}else{
// this.navigationPath.componentName = "member_ssn";
this.ssnData();
}
this.responseData$ = this.store.select('data').subscribe(resp => {
// console.log(resp['post']);
this.isNextClicked = false;
this.currentPageData = resp;
if(resp['isAddClicked']) {
this.isCurrentPage = false;
}
if(resp['isEditClicked']) {
this.isCurrentPage = false;
}
if(resp['isBackClicked']) {
this.isCurrentPage = false;
this.store.dispatch(new TestActions.ResetBackClick());
}
if(this.router.url.indexOf('personalDetails') > 0) {
this.isCurrentPage = false;
}
if(Object.keys(resp['post']).length > 0 && this.isCurrentPage) {
this.nextPage(resp)
}
});
// this.store.select('data').subscribe(data => {
// this.currentPageData = data;
// });
this.store.dispatch(new TestActions.UpdateMembersForm(this.currentPageData['membersForm']['value']));
}