2

次のコンポーネントがあるとします。

import {Component, OnInit} from '@angular/core';
import {Route, Router} from '@angular/router';

@Component({
  selector: 'app-index',
  templateUrl: './index.component.html',
  styleUrls: ['./index.component.css']
})
export class IndexComponent {

  constructor(private router: Router) { }

  hasRoute(controllerName: string): boolean {
    return this.router.config.some((route: Route) => {
      if (route.path === controllerName) {
        return true;
      }
    });
  }
}

単体テストを作成しようとしています:

import { TestBed, async } from '@angular/core/testing';
import { IndexComponent } from './index.component';
import { rootRouterConfig } from '../app.routes';
import { RouterModule } from '@angular/router';
import {APP_BASE_HREF} from "@angular/common";

describe('Component: Index', () => {

  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [
        IndexComponent
      ],
      imports: [
        RouterModule.forRoot(rootRouterConfig)
      ],
      providers: [
        {provide: APP_BASE_HREF, useValue: '/'},
      ],
    });
  });

  it('should create the component', async(() => {
    let fixture = TestBed.createComponent(IndexComponent);
    let component = fixture.debugElement.componentInstance;
    expect(component).toBeTruthy();
  }));

});

エラーメッセージは次のとおりです。

Chrome 52.0.2743 (Windows 10 0.0.0) Component: Index should create the component FAILED
    Failed: Error in ./IndexComponent class IndexComponent_Host - inline template:0:0 caused by: Bootstrap at least one component before injecting Router.
    Error: Bootstrap at least one component before injecting Router.
        at setupRouter (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/router/src/router_module.js:190:0 <- src/test.ts:32672:15)
        at NgModuleInjector.get (DynamicTestModule.ngfactory.js:173:57)
        at NgModuleInjector.DynamicTestModuleInjector.getInternal (DynamicTestModule.ngfactory.js:257:46)
        at NgModuleInjector.get (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/src/linker/ng_module_factory.js:94:0 <- src/test.ts:28153:27)
        at TestBed.get (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/bundles/core-testing.umd.js:1114:0 <- src/test.ts:9246:51)
        at DebugAppView._View_IndexComponent_Host0.createInternal (IndexComponent_Host.ngfactory.js:16:115)
        at DebugAppView.AppView.create (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/src/linker/view.js:125:0 <- src/test.ts:42466:21)
        at DebugAppView.create (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/src/linker/view.js:337:0 <- src/test.ts:42678:44)
        at ComponentFactory.create (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/src/linker/component_factory.js:153:0 <- src/test.ts:27771:36)
        at initComponent (webpack:///C:/Users/Jim/Documents/IdeaProjects/ng2-test/client/~/@angular/core/bundles/core-testing.umd.js:1153:0 <- src/test.ts:9285:53)

どんな助けでも大歓迎です!!

4

1 に答える 1

2

RouterModuleアプリ コンポーネントがプラットフォーム ブートストラップでブートストラップされることを期待していると思います。それがおそらく（とりわけ）彼らが持っている理由RouterTestingModuleです。それを使用してルートを構成します

imports: [
  RouterTestingModule.withRoutes(rootRouterConfig)
]

この投稿で完全な例を見ることもできます

于 2016-09-20T14:07:21.030 に答える