如何将Angular2路由器连接到ngrx/store？

将Angular2路由器连接到ngrx/store的过程如下：

首先，确保你已经安装了ngrx/store和@ngrx/router-store这两个依赖包。
在你的应用程序的根模块中，导入StoreModule和StoreRouterConnectingModule，并将它们添加到imports数组中。这样可以将ngrx/store和ngrx/router-store集成到你的应用程序中。

import { StoreModule } from '@ngrx/store';
import { StoreRouterConnectingModule } from '@ngrx/router-store';

@NgModule({
  imports: [
    StoreModule.forRoot({}),
    StoreRouterConnectingModule.forRoot()
  ],
  ...
})
export class AppModule { }

在你的应用程序的根组件中，导入RouterStateSerializer并实现一个自定义的RouterStateSerializer类。这个类将帮助你将路由器状态转换为可存储在ngrx/store中的对象。

import { RouterStateSerializer } from '@ngrx/router-store';
import { RouterStateUrl } from './router-state-url';

export class CustomRouterStateSerializer implements RouterStateSerializer<RouterStateUrl> {
  serialize(routerState: RouterStateSnapshot): RouterStateUrl {
    let route = routerState.root;

    while (route.firstChild) {
      route = route.firstChild;
    }

    const { url, root: { queryParams } } = routerState;
    const { params } = route;

    return { url, params, queryParams };
  }
}

在你的应用程序的根模块中，将自定义的RouterStateSerializer类提供给RouterStateSerializer令牌。

import { RouterStateSerializer } from '@ngrx/router-store';
import { CustomRouterStateSerializer } from './custom-router-state-serializer';

@NgModule({
  providers: [
    { provide: RouterStateSerializer, useClass: CustomRouterStateSerializer }
  ],
  ...
})
export class AppModule { }

在你的组件中，使用ngrx/store的select函数来选择你想要的路由器状态。你可以使用createFeatureSelector函数来选择特定的状态片段。

import { Component } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { RouterReducerState, getSelectors } from '@ngrx/router-store';

@Component({
  selector: 'app-root',
  template: `
    <div>
      <h1>Current Route:</h1>
      <pre>{{ currentRoute$ | async | json }}</pre>
    </div>
  `
})
export class AppComponent {
  currentRoute$: Observable<RouterReducerState<RouterStateUrl>>;

  constructor(private store: Store) {
    const { selectCurrentRoute } = getSelectors();
    this.currentRoute$ = store.pipe(select(selectCurrentRoute));
  }
}

以上步骤将帮助你将Angular2路由器连接到ngrx/store，并允许你在应用程序中使用ngrx/store来管理路由器状态。