如何对使用router.paramMap的Angular 4组件进行单元测试

Tat*_*eti 12 jasmine karma-jasmine angular

我是角度4的新手,试图从单元测试中测试一个角度4特征router.paramMap,以下面的方式读取路径参数并在我的应用程序中按预期工作.

constructor(private router:Router, private actRoute:ActivatedRoute) {
}

ngOnInit() {
    this.router.paramMap.subscribe(params => {
        params.get(id);
    })
......
}
Run Code Online (Sandbox Code Playgroud)

但是在运行单元测试的时候,即使我通过传递路径参数,我也得到了不能调用未定义的订阅方法的错误.

{
  provide: ActivatedRoute,
  useValue: { params: Observable.of({id: 1}) }
}
Run Code Online (Sandbox Code Playgroud)

请建议

Pre*_*thi 22

你需要提供paramMap而不是params.paramMap应类型的ParamMap@angular/router,所以正常对象可以被转换为ParamMap使用该方法convertToParamMap()@angular/routing.

您可以提供如下的模拟ActivatedRoute:

import { convertToParamMap} from '@angular/router';
....
.....

{
      provide: ActivatedRoute,
      useValue: { paramMap: Observable.of(convertToParamMap({id: 1})) }
}
Run Code Online (Sandbox Code Playgroud)


333*_*att 9

我正在使用一种稍微不同的方法来获取组件中的参数:

this.id = this.route.snapshot.paramMap.get('id');
Run Code Online (Sandbox Code Playgroud)

这就是茉莉花测试中对我有用的东西:

{
      provide: ActivatedRoute,
      useValue: {
        snapshot: {
          paramMap: convertToParamMap({id: 1})
        }
      }
}
Run Code Online (Sandbox Code Playgroud)