Delay for router in Angular2

Viewed 11947

I have this code, which have 2 functions: say() will play the music (is implemented and it works) and router leads to next page (it works also)

go_next() {
     this.say(); // audio
     this.router.navigate( ['app'], { queryParams: { 'part': this.part+1 } } ); //go to next page 
}

But what I would like to do is to play music (it takes 5 sec) and then to go to the next page...how could I implement this?..I guess, I have to implement some kind of delay, but I can't find such parameter by router.navigate.

3 Answers

You could use a resolve on the route.

import { Observable } from 'rxjs';
import { Injectable} from '@angular/core';
import { Resolve } from '@angular/router';

@Injectable()
export class DelayResolve implements Resolve<Observable<any>> {

  constructor() {
  }

  resolve(): any {
    return Observable.of('delayed navigation').delay(500);
  }
}

Then it the routes just apply the resolve:

path: 'yourpath',
component: YourComponent,
resolve: [DelayResolve],
Related