angular 2.0.0-rc.1 + karma：提供RouteSegment

Question

当一个组件被注入RouteSegment时，仅仅在测试中提供RouteSegment是不够的：

component.ts:

export class ComponentToTest {
  private param: string;

  constructor(routeSegment: RouteSegment) {
    this.param = routeSegment.getParam('param');
    this.getData();
  }
}

component.spec.ts:

import {Router, RouteSegment} from '@angular/router';

import {it, inject, beforeEachProviders} from '@angular/core/testing';
import {ROUTER_FAKE_PROVIDERS} from '@angular/router/testing';

import {ComponentToTest} from './component';

describe('ComponentToTest', () => {
  beforeEachProviders(() => [
    ROUTER_FAKE_PROVIDERS,
    RouteSegment,
    ComponentToTest
  ]);

  it('should call getData() on contruct', inject([Router], (router) => {
    spyOn(ComponentToTest.prototype, 'getData');
    expect(ComponentToTest.prototype.getData).not.toHaveBeenCalled();
    let component = new ComponentToTest(router);
    expect(ComponentToTest.prototype.getData).toHaveBeenCalled();
  }));
});

会出现以下错误：

Error: Cannot resolve all parameters for 'RouteSegment'(?, ?, ?, ?, ?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'RouteSegment' is decorated with Injectable.

我不知道如何提供 RouteSegment 参数。

Answer 1

我有同样的问题，我不得不查看 angular 路由器代码和它们在 repo 中的规范。您应该能够像这样提供 routeSegment：

import {RouteSegment, Router} from '@angular/router';
provide(RouteSegment, {useFactory: (r: any) => r.routeTree.root, deps: [Router]})

或者您可以模拟一个新的 RouteSegment，类似于您对 RouteParams 的处理方式：

provide(RouteParams, { useValue: new RouteParams({ page: 'terms-conditions' }) }),

现在是这样的：

provide(RouteSegment, { useValue: new RouteSegment([], { page: 'terms-conditions' }, null, null, null) }),

要创建它，您只需向它传递几个额外的参数。

Answer 2

解决方案 1

对我不起作用，仍然不确定为什么。

解决方案 2

RouteSegment 的模拟实现：

class MockRouteSegment implements RouteSegment {
  urlSegments: any;
  parameters: any;
  outlet: string;
  _type: any;
  _componentFactory: any;
  type: any;
  stringifiedUrlSegments: string;
  constructor(parameters?: { [key: string]: any; }) {
    this.parameters = parameters
  }
  getParam(param: string) {
    return this.parameters[param];
  }
}

这样提供：

provide(RouteSegment, { useValue: new MockRouteSegment({ 'key': 'value' }) })

angular 2.0.0-rc.1 + karma：提供RouteSegment

angular 2.0.0-rc.1 + karma: provide RouteSegment

angular

angular2-routing

解决方案 1

解决方案 2