Angular 5 Router навигация от обратного вызова ничего не делает

Question

Я застрял на навигации из функции обратного вызова, router.navigate ничего не делает.

Я видел в stackoverflow, что использование NgZone может помочь, но все еще безуспешно, единственное, что работает, это использование window.location.href = 'url ...'

но это не угловые функции, и я действительно хочу понять, что не так.

Вот мой код.

@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]
})

компонент:

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
      }
    });

Тоже попробовал вот так и безуспешно:

this.zone.runTask(()=>{
      this.router.navigate(['/']);
    })

Answer 1

Похоже, вы теряете свой контекст, попробуйте жирную стрелку в обратном вызове.

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
  }
});

Когда вы используете обратный вызов, вы должны быть уверены, что он будет использовать ваш контекст, текущим this должен быть ваш компонент, в машинописном тексте вы будете использовать жирная стрелка оператор (=>), который имеет тот же эффект, что и vanilla js function.bind(this), чтобы быть уверенным, что в коде обратного вызова будет использоваться правильное this, в противном случае объектом обратного вызова this будет объект window.