I want to redirect from signup component to challenge component after signup. If the local storage not set into the challenge component it will redirect to the signup component. My problem is to it will not navigate from signup to challenge component for the first time signup.
challange.component.ts
ngOnInit() {
if(localStorage.getItem('userId') != null) {
......
}
else{
this.router.navigate(['/signup']);
}
}
signup.component.ts
signupNew() {
this.signupService.doSignup(this.parameter);
this.router.navigate(['/challange']);
}
signup.service.ts
doSignup(signParam : SignupParam) {
this.signupCollection.add(signParam).then(ref => {
localStorage.setItem('userId', ref.id);
console.log(localStorage.getItem('userId'))
}).catch(err => {
console.log('Check your Internet connection...');
})
}
route.ts
export const appRoutes : Routes = [
{ path : 'signup', component : SignupComponent },
{ path : 'challange', component: ChallangeComponent},
{ path : 'feed', component: NewsFeedComponent},
{ path : 'items-initial', component: InitialItemComponent},
{ path: '', redirectTo: '/', pathMatch : 'full'}
];
I think your issue is here:
this.signupService.doSignup(this.parameter);
this.router.navigate(['/challange']);
doSignup is asynchronous and you are not synchronizing it, so the router is navigating to /challange before userId is set in local storage which leads to another redirect the first time. However, at that point, the userId would be in localStorage. Synchronize these calls:
async doSignup(signParam : SignupParam) {
// error handling omitted
const ref = await this.signupCollection.add(signParam);
localStorage.setItem('userId', ref.id);
}
async signupNew() {
await this.signupService.doSignup(this.parameter);
this.router.navigate(['/challange']);
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments