代码之家  ›  专栏  ›  技术社区  ›  Edgar Quintero

角度测试中没有$injector的提供者

  •  2
  • Edgar Quintero  · 技术社区  · 6 年前

    我一直在尝试在我们的混合AngularJS/NG6应用程序中设置测试,但哇,这很难做到。我不断地犯错误。最新版本如下:

    错误:StaticInjectorError(DynamictesModule)[$Injector]:

    StaticInjectorError(平台:核心)[$Injector]:

    空寄存器错误:没有$injector的提供程序!

    我有以下内容 component :

    import { Component, OnInit, Input, Inject } from '@angular/core';
    import { DashboardService } from '../../services/dashboard/dashboard.service';
    
    @Component({
        templateUrl: './views/components/dashboard/dashboard.component.html'
    })
    export class DashboardComponent implements OnInit {
        @Input()
        Session;
        Util;
        constructor(
            private _dashboardService: DashboardService,
            @Inject('Session') Session: any,
            @Inject('Util') Util: any
        ) {
            this.Session = Session;
            this.Util = Util;
        }
    
        ngOnInit() {
            this._dashboardService
                .getPrograms(this.Session.user.organization)
                .subscribe(
                    data => {
                        console.log(data);
                    },
                    error => {
                        console.log(error);
                    }
                );
        }
    }
    

    那很好用。我可以从我们的API中提取数据。另一方面,我有这个 spec 文件:

    import { async, ComponentFixture, TestBed } from '@angular/core/testing';
    import { FormsModule, ReactiveFormsModule } from '@angular/forms';
    import { CommonModule } from '@angular/common';
    
    import { DashboardComponent } from './dashboard.component';
    import { DebugElement } from '@angular/core';
    
    import { DashboardService } from '../../services/dashboard/dashboard.service';
    import { ApiService } from '../../services/api.service';
    
    import { HttpClientModule } from '@angular/common/http';
    
    describe('The Dashboard', () => {
        let component: DashboardComponent;
        let fixture: ComponentFixture<DashboardComponent>;
        let de: DebugElement;
    
        beforeEach(async(() => {
            TestBed.configureTestingModule({
                imports: [
                    CommonModule,
                    FormsModule,
                    ReactiveFormsModule,
                    HttpClientModule
                ],
                declarations: [DashboardComponent],
                providers: [
                    {
                        provide: 'Util',
                        useFactory: ($injector: any) => $injector.get('Util'),
                        deps: ['$injector']
                    },
                    {
                        provide: 'Session',
                        useFactory: ($injector: any) => $injector.get('Session'),
                        deps: ['$injector']
                    },
                    DashboardService,
                    ApiService            
                ]
            })
                .overrideComponent(DashboardComponent, {
                    set: {
                        templateUrl:
                            '/dist/views/components/dashboard/dashboard.component.html'
                    }
                })
                .compileComponents();
        }));
    
        beforeEach(() => {
            fixture = TestBed.createComponent(DashboardComponent);
            component = fixture.componentInstance;
            de = fixture.debugElement;
            fixture.detectChanges();
        });
    
        it('should be created', () => {
            expect(component).toBeTruthy();
        });
    });
    

    当我运行这个 规格 文件我得到上面列出的错误。我不知道错误在告诉我什么,因为它很模糊。

    我如何提供 $Injector 模块正确插入 规格 文件?

    1 回复  |  直到 6 年前
        1
  •  2
  •   Koen Meijer    6 年前

    我还尝试在我的混合应用程序中测试角度部件,这些部件依赖于AngularJS,但我没有成功完成。要在混合体中测试角度依赖的AngularJS零件或角度依赖的AngularJS零件是非常困难的。

    我找到了两个可能的解决办法 post 吉瑟布论
    -完全模仿另一个框架中的部分。
    -创建包含来自其他框架的所有依赖项的迷你应用程序。