Angularjs 当我向构造函数添加服务时,Fixture.detectChanges的行为非常奇怪
我有一个父组件:Angularjs 当我向构造函数添加服务时,Fixture.detectChanges的行为非常奇怪,angularjs,typescript,angular,jasmine,karma-runner,Angularjs,Typescript,Angular,Jasmine,Karma Runner,我有一个父组件: @Component({ selector: 'parent-component', directives: [I18nDirective, child-component], template: require('./parent.component.html'), styles: [require('./parent.component.scss')], }) export class ParentComponent { } @Component({ selector:
@Component({
selector: 'parent-component',
directives: [I18nDirective, child-component],
template: require('./parent.component.html'),
styles: [require('./parent.component.scss')],
})
export class ParentComponent {
}
@Component({
selector: 'child-component',
template: require('./child-component.component.html'),
styles: [require('./child-component.component.scss')]
})
export class ChildComponent {
constructor(private _eventAggregator: EventAggregatorService, private _zone: NgZone) {}
然后我有子组件:
@Component({
selector: 'parent-component',
directives: [I18nDirective, child-component],
template: require('./parent.component.html'),
styles: [require('./parent.component.scss')],
})
export class ParentComponent {
}
@Component({
selector: 'child-component',
template: require('./child-component.component.html'),
styles: [require('./child-component.component.scss')]
})
export class ChildComponent {
constructor(private _eventAggregator: EventAggregatorService, private _zone: NgZone) {}
在父组件的html中,我使用:子组件
问题在于子组件的规格测试。在以下情况下通过测试:
describe('Center On Me Button', () => {
let fixture;
let nativeElement;
let componentInstance;
beforeEachProviders(() => [
ChildComponent,
EventAggregatorService,
GeoLocationService,
provide(GoogleMapsAPIWrapper, {useClass: StabGoogleMapsApiWrapper}),
provide(MapController, {useClass: StabMapControllerService}),
provide(MapEventsService, {useClass: StabMapEventsService})
]);
beforeEach(injectAsync([TestComponentBuilder, GoogleMapsAPIWrapper, GeoLocationService, MapController, EventAggregatorService
], (tcb: TestComponentBuilder ) => {
return tcb
.createAsync(ChildComponent).then((componentFixture: ComponentFixture<ChildComponent>) => {
({nativeElement, componentInstance} = componentFixture);
fixture = componentFixture;
componentFixture.detectChanges();
});
it('should enable Geolocation button when it is clicked', done => {
componentInstance.isGeoLocationButtonEnabled = false;
nativeElement.querySelector('.toggle.fa.fa-crosshairs').click();
expect(componentInstance.isGeoLocationButtonEnabled).toBe(true);
done();
});
}));
我所做的只是将:私有someService:someService添加到子组件的构造函数中。因此我现在:
export class ChildComponent {
constructor(private _eventAggregator: EventAggregatorService, private _zone: NgZone, private _someService: SomeService) {}
我添加的这项服务被添加到angular应用程序顶层的提供者列表中。当然,我将它添加到测试本身的提供者列表中
当我这样做时,测试开始失败,与我写的前一条消息。这到底是为什么?我真的不明白这种行为,而且网络上的资源有限。还没有文档。可能不是这样:当我添加private\u geoLocationService:geoLocationService时,我会得到相同的行为,并且在每个提供程序之前插入geolocation服务。