Angular 2 路由器在打开组件之前解析服务器请求

Question

我有一个映射到 url /books/:id 的 BookDetailComponent 组件。在 angular 2 路由器中有什么方法可以确保仅在从服务器检索具有给定 id 的 Book 之后才打开此组件？

我正在寻找 Angular 2 路由器中类似 ui-router resolve 的类似功能。

/*** BookComponent ***/
@RouteConfig([
  {path: "/books/:id", component: BookDetailComponent, as: "BookDetail"},
])

export class BookComponent {
}


/*** BookDetailComponent ***/
export class BookDetailComponent {

  book:Book;

  constructor(private bookService:BookService,
              private routeParams:RouteParams) {
  }


  ngOnInit() {
    let id = this.routeParams.get("id");
    this.bookService.getBook(parseInt(id))
      .subscribe(book => this.book = book.json());
  }
}

Answer 1

是的，通过实现 OnActivate 接口并返回您正在等待加载的对象的承诺：

https://angular.io/docs/js/latest/api/router/OnActivate-interface.html