À L'Aide De Résoudre Dans Angular2 Routes

@AndréWerlang réponse était bonne, mais si vous voulez l'résolu données sur la page pour modifier lorsque le paramètre de route changements, vous devez:

Resolver:

@Injectable()
export class MessageResolver implements Resolve<Message> {

  constructor(private messageService: MessageService, private router: Router) {}

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Message> {
    const id = +route.params['id'];
    return this.messageService.getById(id);
  }
}

Votre composant:

ngOnInit() {
  this.route.data.subscribe((data: { message: Message }) => {
    this.message = data.message;
  });
}

Comme alexpods l'a déjà mentionné, il ne semble pas être un "résoudre" en tant que tel. L'idée semble être que l'utilisation du cycle de vie des crochets que le routeur fournit. Ce sont:

• canReuse
• canDeactivate
• onActivate
• onReuse
• onDeactivate

Puis il y a @CanActivate. C'est un crochet spécial parce qu'elle est appelée avant que le composant est instancié. Ses paramètres sont (next, previous) qui sont les composants que vous êtes le routage et le composant que vous venez d' (ou null si vous n'avez pas l'histoire), respectivement.

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES, CanActivate, OnActivate} from '@angular/router';

@Component({
    selector: 'news',
    templateUrl: 'newsView.html',
    directives: [ROUTER_DIRECTIVES]
})

@CanActivate((next) => {
    return messageService.getMessage()
        .then((message) => {
            next.params.message = message;
            return true; //truthy lets route continue, false stops routing
        });
})

export class Accounts implements OnActivate {

    accounts:Object;

    onActivate(next) {
        this.message = next.params.message;
    }
}

La chose que je n'ai pas compris encore est de savoir comment obtenir le résultat de la promesse dans votre onActivate - autres de les stocker sur votre prochaine pièce. C'est parce que onActivate est également invoqué avec prochaine et précédente et non le résultat de la promesse.
Je ne suis pas heureux avec cette solution mais c'est le mieux que je pouvais venir.

Vous pouvez créer votre programme de résolution dans Angular2+ et de l'appliquer à l'routeur assez facilement. regardez-la ci-dessous, voici la façon de créer le programme de résolution Angulaire:

@Injectable()
export class AboutResolver implements Resolve<Message> {

  constructor(private aboutService: AboutService, private router: Router) {}

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> {
    const id = route.params['id'];
    return this.aboutService.getById(id);
  }
}

puis dans la config routeur:

export const Routes: RouterConfig = [
  { path: 'about',  component: AboutComponent, resolve: { data: AboutResolver } }
]; 

et enfin dans votre composant:

ngOnInit() {
  this.route.data.subscribe((data: { about: About }) => {
    this.about = data.about;
  });
}