I'm stuck on navigation from callback function, router.navigate do nothing.
I saw in stackoverflow that using NgZone may help but still no success, only thing which working is using window.location.href = 'url...'
but this is not angular functions and i really want to understand what wrong.
Here is my code.
@NgModule({
declarations: [
AppComponent,
LoginComponent,
ChatComponent,
NotFoundComponent,
HomeComponent
],
imports: [
BrowserModule,
RouterModule.forRoot([
{ path: '', component: HomeComponent },
{ path: 'login', component: LoginComponent },
{path:'chat',component:ChatComponent},
{ path: '**', component: NotFoundComponent }
])
],
providers: [],
bootstrap: [AppComponent]
})
component:
import { ActivatedRoute, Router } from '@angular/router';
constructor(private router: Router,
private route: ActivatedRoute,
private zone: NgZone) { }
Parse.FacebookUtils.logIn('email,user_birthday,user_friends', {
success: function (user) {
// Handle successful login
console.log(user);
this.router.navigate(['/']);
},error: function (user, error) {
// Handle errors and cancellation
}
});
Also tried like this ans still no success:
this.zone.runTask(()=>{
this.router.navigate(['/']);
})
It seems that you are loosing your context, try with a fat arrow in the callback.
Parse.FacebookUtils.logIn('email,user_birthday,user_friends', {
success: (user) => {
// Handle successful login
console.log(user);
this.router.navigate(['/']);
},error: (user, error) => {
// Handle errors and cancellation
}
});
When you use a callback you must be sure that it will use your context, the current this should be your component, in typescript you will use the fat arrow operator (=>) that has the same effect of the vanilla js function.bind(this) to be sure that the code in the callback will use the right this, otherwise the thisobject of the callback will be the window object.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments