Angular 4 - 失败:无法解析 ActivatedRoute 的所有参数:(?, ?, ?, ?, ?, ?, ?, ?)
Angular 4 - Failed: Can't resolve all parameters for ActivatedRoute: (?, ?, ?, ?, ?, ?, ?, ?)
我参考了以下 link 以获得答案,但我找不到适合我的场景的任何有效解决方案。
因此,我一直在尝试从提供者那里删除 Activated Route,但测试平台仍然没有通过。它显示
Error: No provider for ActivatedRoute!
这是我的代码,我想在 angular 应用程序中 运行 我的测试平台,该应用程序正在使用 Jasmine。
import { ActivatedRoute } from '@angular/router';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterModule, Routes } from '@angular/router';
import { RouterTestingModule } from '@angular/router/testing';
describe('SomeComponent', () => {
let component: SomeComponent;
let fixture: ComponentFixture<SomeComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [ RouterModule, RouterTestingModule ],
declarations: [ SomeComponent ],
providers: [ ActivatedRoute ],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SomeComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
获取错误
您想向您的组件注入一个伪造的 ActivatedRoute,因为您在测试中自己创建了它,因此路由器不会为您创建它并注入一个 ActivatedRoute。所以你可以使用这样的东西:
describe('SomeComponent', () => {
const fakeActivatedRoute = {
snapshot: { data: { ... } }
} as ActivatedRoute;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [ RouterTestingModule ],
declarations: [ SomeComponent ],
providers: [ {provide: ActivatedRoute, useValue: fakeActivatedRoute} ],
})
.compileComponents();
}));
});
{
provide: ActivatedRoute,
useValue: {
snapshot: {
queryParamMap: {
get(): number {
return 6;
}
}
}
}
}
这是 angular 7
的解决方案
{
provide: ActivatedRoute,
useValue: {
snapshot: {
paramMap: {
get(): string {
return '123';
},
},
},
},
},
我参考了以下 link 以获得答案,但我找不到适合我的场景的任何有效解决方案。
因此,我一直在尝试从提供者那里删除 Activated Route,但测试平台仍然没有通过。它显示
Error: No provider for ActivatedRoute!
这是我的代码,我想在 angular 应用程序中 运行 我的测试平台,该应用程序正在使用 Jasmine。
import { ActivatedRoute } from '@angular/router';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterModule, Routes } from '@angular/router';
import { RouterTestingModule } from '@angular/router/testing';
describe('SomeComponent', () => {
let component: SomeComponent;
let fixture: ComponentFixture<SomeComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [ RouterModule, RouterTestingModule ],
declarations: [ SomeComponent ],
providers: [ ActivatedRoute ],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SomeComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
获取错误
您想向您的组件注入一个伪造的 ActivatedRoute,因为您在测试中自己创建了它,因此路由器不会为您创建它并注入一个 ActivatedRoute。所以你可以使用这样的东西:
describe('SomeComponent', () => {
const fakeActivatedRoute = {
snapshot: { data: { ... } }
} as ActivatedRoute;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [ RouterTestingModule ],
declarations: [ SomeComponent ],
providers: [ {provide: ActivatedRoute, useValue: fakeActivatedRoute} ],
})
.compileComponents();
}));
});
{
provide: ActivatedRoute,
useValue: {
snapshot: {
queryParamMap: {
get(): number {
return 6;
}
}
}
}
}
这是 angular 7
的解决方案{
provide: ActivatedRoute,
useValue: {
snapshot: {
paramMap: {
get(): string {
return '123';
},
},
},
},
},