typescript 从哪里导入NgxMqttServiceConfig？NullInjectorAngular 测试中的误差

pn9klfpd 于 2023-06-24 发布在 TypeScript

关注(0)|答案(2)|浏览(145)

我正在使用Angular 8和ngx-mqtt开发一个应用程序。当我运行测试（在.spec.ts文件中定义的测试）时，我得到了这个错误：

NullInjectorError: StaticInjectorError(DynamicTestModule)[InjectionToken NgxMqttServiceConfig]: 
      StaticInjectorError(Platform: core)[InjectionToken NgxMqttServiceConfig]: 
        NullInjectorError: No provider for InjectionToken NgxMqttServiceConfig!
    error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ InjectionToken NgxMqttServiceConfig ], ngDebugContext: DebugContext_({ view: Object({ def: Object({ factory: Function, nodeFlags: 33800193, rootNodeFlags: 33554433, nodeMatchedQueries: 0, flags: 0, nodes: [ Object({ nodeIndex: 0, parent: null, renderParent: null, bindingIndex: 0, outputIndex: 0, checkIndex: 0, flags: 33554433, childFlags: 245760, directChildFlags: 245760, childMatchedQueries: 0, matchedQueries: Object({  }), matchedQueryIds: 0, references: Object({  }), ngContentIndex: null, childCount: 1, bindings: [  ], bindingFlags: 0, outputs: [  ], element: Object({ ns: '', name: 'app-movies', attrs: [  ], template: null, componentProvider: Object({ nodeIndex: 1, parent: <circular reference: Object>, renderParent: <circular reference: Object>, bindingIndex: 0, outputIndex: 0, checkIndex: 1, flags: 245760, childFlags: 0, directChildFlags: 0, childMatchedQueries: 0, matchedQueries: Object, matchedQueryIds: 0, references: Object, ngC ...
        at <Jasmine>
        at NullInjector.get (http://localhost:9876/_karma_webpack_/vendor.js:40144:27)
        at resolveToken (http://localhost:9876/_karma_webpack_/vendor.js:55062:24)
        at tryResolveToken (http://localhost:9876/_karma_webpack_/vendor.js:54988:16)
        at StaticInjector.get (http://localhost:9876/_karma_webpack_/vendor.js:54838:20)
        at resolveToken (http://localhost:9876/_karma_webpack_/vendor.js:55062:24)
        at tryResolveToken (http://localhost:9876/_karma_webpack_/vendor.js:54988:16)
        at StaticInjector.get (http://localhost:9876/_karma_webpack_/vendor.js:54838:20)
        at resolveNgModuleDep (http://localhost:9876/_karma_webpack_/vendor.js:66025:29)
        at NgModuleRef_.get (http://localhost:9876/_karma_webpack_/vendor.js:67091:16)
        at injectInjectorOnly (http://localhost:9876/_karma_webpack_/vendor.js:40023:33)
    Error: Expected undefined to be truthy.
        at <Jasmine>
        at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/main.js:1731:27)
        at ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/polyfills.js:3833:26)
        at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/vendor.js:138795:39)

这是我当前的.spec.ts文件：

describe("MoviesComponent", () => {
    let component: MoviesComponent;
    let fixture: ComponentFixture<MoviesComponent>;

    FeveTestBed.prepare([MoviesComponent]);

    beforeEach(() => {
        fixture = TestBed.createComponent(MoviesComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    it("should create", () => {
        expect(component).toBeTruthy();  // <------- FAILS HERE
    });
});

在.component.ts文件中，我使用了MqttService，它从“ngx-mqtt”导入并通过构造函数注入。组件运行良好，但测试不是。我对.spec.ts文件没有什么经验，但我猜这个错误可能与测试文件中缺少的某些导入或提供程序有关。我尝试将MqttServiceConfig添加到 MoviesComponent.spec.ts 中，如下所示：

beforeEach(() => {
    fixture = TestBed.configureTestingModule({ imports: [MqttServiceConfig] }).createComponent(MoviesComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
});

这一点（受this启发）：

it('should create', async(inject([MqttServiceConfig], (myService: MqttServiceConfig) => ...

我尝试这个是因为我不知道从哪里导入NgxMqttServiceConfig。我的意思是，它包含在MqttModule中，但没有暴露。还尝试使用MqttModule而不是MqttServiceConfig，但没有结果。我错过了什么？

typescript

来源：https://stackoverflow.com/questions/63357934/where-to-import-ngxmqttserviceconfig-from-nullinjectorerror-error-in-angular-te

2条答案

按热度按时间

mznpcxlj1#

最后，将MqttModule沿着配置添加到AppComponent的TestBed中。我试图单独添加MqttModule，并在MoviesComponent而不是AppComponent中添加。
My app.module.ts：

@NgModule({
    declarations: [
        AppComponent,
        MoviesComponent,
        ...
    ],
    imports: [
        BrowserModule,
        HttpClientModule,
        MqttModule.forRoot(AppConstants.MQTT_SERVICE_OPTIONS),
        ...
    ],
    providers: [
        { provide: ErrorHandler, useClass: ErrorHandlerService },
        ...
    ],
    bootstrap: [
        AppComponent
    ]
})
export class AppModule { }

我的 app.component.spec.ts：

beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports: [
            HttpClientModule,
            MqttModule.forRoot(AppConstants.MQTT_SERVICE_OPTIONS),
            ...
        ],
        providers: [
            { provide: ErrorHandler, useClass: ErrorHandlerService },
            ...
        ]
    }).compileComponents();
}));

其中AppConstants.MQTT_SERVICE_OPTIONS是一个普通对象，配置为ngx-mqtt。

赞(0）回复(0）举报 2023-06-24

ojsjcaue2#

Here the following app.module.ts code to prevent of this error :

import { NgModule } from '@angular/core'; 
import { MqttModule, MQTT_SERVICE_OPTIONS } from 'ngx-mqtt'; import { BrowserModule } from '@angular/platform-browser'; 
import { RouteReuseStrategy } from '@angular/router'; 
import { IonicModule, IonicRouteStrategy } from '@ionic/angular'; 
import { AppComponent } from './app.component'; 
import { AppRoutingModule } from './app-routing.module'; 

@NgModule({ declarations: [AppComponent], imports: [ BrowserModule, IonicModule.forRoot(), AppRoutingModule, MqttModule.forRoot(MQTT_SERVICE_OPTIONS), ], providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }], bootstrap: [AppComponent], })

export class AppModule {}

赞(0）回复(0）举报 2023-06-24

我来回答

typescript 从哪里导入NgxMqttServiceConfig？NullInjectorAngular 测试中的误差

2条答案

相关问题

热门标签

最新问答