typescript - 為核心組件提供 Angular 2 的路由服務

我有一個 ng2 應用程式，在那裡我有 app/app.module... 和 core/core.module...

在核心模組中，我有一些模組是在應用程式頂層使用且只使用一次的（就像官方文件中一樣），但是其中一個模組需要 Router 模組（某些功能與路由器一起工作）。

但是路由器是在 App.module 中提供的（包含所有 App 路由）。我遇到的問題是 - 從 core/header/header.component 沒有 ActivatedRouteSnapshot 的提供者

我該如何解決它？我應該將我的標頭從 core 放到 app 資料夾，還是應該為 core 模組提供路由？謝謝。

附言：已更新路由模組。我仍然收到錯誤 - 沒有提供 RouterStateSnapshot！

其他有趣的事情是標準路由器和 activatedRoute 都能正常工作。所以當我從構造函數中移除 RouterStateSnapshot（當然也移除了相關的 console.log）時，所有代碼都能正常運行。所以看起來 routerModule 是可用的，這真的很奇怪。

import { NgModule, Component, OnInit} from '@angular/core';
import { CommonModule } from '@angular/common';
//import { ROUTER_DIRECTIVES, Router } from '@angular/router-deprecated';
import { Router, ActivatedRoute, Params, RouterStateSnapshot } from '@angular/router';
/* ------- !Angular2 core  ---------*/

import {HTTPPatientsListService} from '%cgm_sharedServices%/http_patients_list.service';
/* ------- !Services  ---------*/

import { Config } from 'appConfig';
/* ------- !Config  ---------*/


@Component({
  selector: 't_breadcrumbs',
  template: `

      <h1>Bread</h1>

        <!--<div class="row wrapper border-bottom white-bg page-heading">-->
        <!--<div class="col-lg-10">-->
            <!--<h2>{{staticData.title}}</h2>-->
            <!--<ol class="breadcrumb">-->
              <!--<li>-->
                 <!--<a [routerLink]="['Dashboard']" tabindex="-1">{{staticData.homeName}}</a>-->
              <!--</li>-->
              <!--<li *ngFor="let crumbData of crumbsCollection; let last = last" [ngClass]="{'active': last}">-->
                  <!--<a *ngIf="!last" (click)="navigateTo(crumbData.urlPath)" tabindex="-1">{{crumbData.displayName}}</a>-->
                  <!--<span *ngIf="last"><b>{{crumbData.displayName}}</b></span>-->
              <!--</li>-->
            <!--</ol>-->
          <!--</div>-->
          <!--<div class="col-lg-2">-->
        <!---->
            <!--</div>-->
        <!--</div>-->
  `,
  styles: [`
    .breadcrumb {
      background-color: #ffffff;
      padding: 0;
      margin-bottom: 0;
    }

    .breadcrumb > li a {
      color: inherit;
    }

    .breadcrumb > .active {
      color: inherit;
    }
  `]
})

export class BreadcrumbsComponent implements OnInit {




  // contains home static name and dynamic current component name
  private staticData = {
    'title': '',
    'homeName': 'Home'
  };

  private tempTitle: string;
  private crumbsCollection = [];

  constructor(
    private router: Router,
    private activatedRoute: ActivatedRoute,
    private routerStateSnap: RouterStateSnapshot,

    private config: Config,
    private httpPat: HTTPPatientsListService) { }


  ngOnInit() {
    console.log(this.activatedRoute);
    console.log(this.routerStateSnap);
  }


}


import { RouterModule } from '@angular/router';
@NgModule({
  imports: [ CommonModule, RouterModule ],
  declarations: [ BreadcrumbsComponent ],
  exports: [ BreadcrumbsComponent ]
})

export class BreadcrumbsModule {}

答案＃1

RouterStateSnapshot 介面的預期用法是：

  constructor(router: Router) {
    const snapshot: RouterStateSnapshot = router.routerState.snapshot;
    //...
  }

它用作介面，而不是提供者。它可能在守衛中可用，但那是因為它被作為參數提供在守衛方法中，而不是作為可注入的（例如參見 CanActivate）。