使用Angular 7的Karma和Jasmine注入服务测试-静态注入错误（DynamicTestModule）[I18n->；注入令牌转换格式]_Angular_Karma Jasmine_Angular Test

使用Angular 7的Karma和Jasmine注入服务测试-静态注入错误（DynamicTestModule）[I18n->；注入令牌转换格式]

angular

使用Angular 7的Karma和Jasmine注入服务测试-静态注入错误（DynamicTestModule）[I18n->；注入令牌转换格式],angular,karma-jasmine,angular-test,Angular,Karma Jasmine,Angular Test,这不是一个骗局。。。。或。。。这是一个稍微不同的问题，对我没有帮助- 当我使用Jasmine和Karma运行ngtest时，出现以下错误： Error: StaticInjectorError(DynamicTestModule)[I18n -> InjectionToken TranslationsFormat]: StaticInjectorError(Platform: core)[I18n -> InjectionToken TranslationsFormat]

这不是一个骗局

。。。。或

。。。这是一个稍微不同的问题，对我没有帮助-

当我使用Jasmine和Karma运行

ngtest

时，出现以下错误：

Error: StaticInjectorError(DynamicTestModule)[I18n -> InjectionToken TranslationsFormat]: 
  StaticInjectorError(Platform: core)[I18n -> InjectionToken TranslationsFormat]: 
    NullInjectorError: No provider for InjectionToken TranslationsFormat!

我的应用程序中有一个测试，用于测试主数据服务的创建：

数据服务规范ts

import { TestBed, inject } from '@angular/core/testing';

import { DataService } from './data.service';
import { I18n } from '@ngx-translate/i18n-polyfill';

describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, I18n]
    });
  });

  it('should be created', inject([DataService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));
});

import { Injectable } from '@angular/core';
import { I18n } from '@ngx-translate/i18n-polyfill';


@Injectable({
  providedIn: 'root'
})
export class DataService {

  SOME_CONSTANT = this.i18n('Translate this text');

  constructor(private i18n: I18n, private authService: AuthService) {

    ...
  }

  public serviceMethod() {
    return ...
  }

}

declare var require: any;

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, LOCALE_ID, TRANSLATIONS, TRANSLATIONS_FORMAT } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { I18n } from '@ngx-translate/i18n-polyfill'; // polyfill to support i18n for text in .ts files (until supported by Angular)
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { LocaleService} from './services/locale.service';
import { SharedModule } from './shared/shared.module';
import { CoreModule } from './core/core.module';

defineLocale('engb', enGbLocale);
defineLocale('de', deLocale);
defineLocale('es', esLocale);
defineLocale('fr', frLocale);
defineLocale('zhcn', zhCnLocale);
defineLocale('ru', ruLocale);

/*
export function localeFactory(): string {
  return LocaleDatePipe.localeId;
}
*/

export function selectedLocaleFactory(): string {
  const localeService = new LocaleService();
  return localeService.getCurrentLanguage();
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    CoreModule,
    SharedModule,
    AppRoutingModule
  ],
  providers:
  [
    BsLocaleService,
    I18n,
    {
      provide: TRANSLATIONS,
      useFactory: (locale) => {
        locale = locale || 'en'; // default to english if no locale provided
        return require(`raw-loader!../locale/messages.${locale}.xlf`);
      },
      deps: [LOCALE_ID]
    },
    {
      provide: TRANSLATIONS_FORMAT,
      useValue: 'xlf'
    },
    {
      provide: LOCALE_ID,
      useFactory: selectedLocaleFactory
    }
  ],
  bootstrap: [AppComponent],
  entryComponents: [ConfirmationComponent]
})

export class AppModule { }

import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataService } from './services/data.service';

import { BsLocaleService } from 'ngx-bootstrap/datepicker';
import { LocaleService } from './services/locale.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit, OnDestroy {

  constructor(private dataService: DataService,
    private localeService: LocaleService,
    private bsLocaleService: BsLocaleService) { }

  ngOnInit() {

     ... nothing relevant
  }
}

数据服务.ts

import { TestBed, inject } from '@angular/core/testing';

import { DataService } from './data.service';
import { I18n } from '@ngx-translate/i18n-polyfill';

describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, I18n]
    });
  });

  it('should be created', inject([DataService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));
});

import { Injectable } from '@angular/core';
import { I18n } from '@ngx-translate/i18n-polyfill';


@Injectable({
  providedIn: 'root'
})
export class DataService {

  SOME_CONSTANT = this.i18n('Translate this text');

  constructor(private i18n: I18n, private authService: AuthService) {

    ...
  }

  public serviceMethod() {
    return ...
  }

}

declare var require: any;

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, LOCALE_ID, TRANSLATIONS, TRANSLATIONS_FORMAT } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { I18n } from '@ngx-translate/i18n-polyfill'; // polyfill to support i18n for text in .ts files (until supported by Angular)
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { LocaleService} from './services/locale.service';
import { SharedModule } from './shared/shared.module';
import { CoreModule } from './core/core.module';

defineLocale('engb', enGbLocale);
defineLocale('de', deLocale);
defineLocale('es', esLocale);
defineLocale('fr', frLocale);
defineLocale('zhcn', zhCnLocale);
defineLocale('ru', ruLocale);

/*
export function localeFactory(): string {
  return LocaleDatePipe.localeId;
}
*/

export function selectedLocaleFactory(): string {
  const localeService = new LocaleService();
  return localeService.getCurrentLanguage();
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    CoreModule,
    SharedModule,
    AppRoutingModule
  ],
  providers:
  [
    BsLocaleService,
    I18n,
    {
      provide: TRANSLATIONS,
      useFactory: (locale) => {
        locale = locale || 'en'; // default to english if no locale provided
        return require(`raw-loader!../locale/messages.${locale}.xlf`);
      },
      deps: [LOCALE_ID]
    },
    {
      provide: TRANSLATIONS_FORMAT,
      useValue: 'xlf'
    },
    {
      provide: LOCALE_ID,
      useFactory: selectedLocaleFactory
    }
  ],
  bootstrap: [AppComponent],
  entryComponents: [ConfirmationComponent]
})

export class AppModule { }

import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataService } from './services/data.service';

import { BsLocaleService } from 'ngx-bootstrap/datepicker';
import { LocaleService } from './services/locale.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit, OnDestroy {

  constructor(private dataService: DataService,
    private localeService: LocaleService,
    private bsLocaleService: BsLocaleService) { }

  ngOnInit() {

     ... nothing relevant
  }
}

应用程序模块.ts

import { TestBed, inject } from '@angular/core/testing';

import { DataService } from './data.service';
import { I18n } from '@ngx-translate/i18n-polyfill';

describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, I18n]
    });
  });

  it('should be created', inject([DataService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));
});

import { Injectable } from '@angular/core';
import { I18n } from '@ngx-translate/i18n-polyfill';


@Injectable({
  providedIn: 'root'
})
export class DataService {

  SOME_CONSTANT = this.i18n('Translate this text');

  constructor(private i18n: I18n, private authService: AuthService) {

    ...
  }

  public serviceMethod() {
    return ...
  }

}

declare var require: any;

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, LOCALE_ID, TRANSLATIONS, TRANSLATIONS_FORMAT } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { I18n } from '@ngx-translate/i18n-polyfill'; // polyfill to support i18n for text in .ts files (until supported by Angular)
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { LocaleService} from './services/locale.service';
import { SharedModule } from './shared/shared.module';
import { CoreModule } from './core/core.module';

defineLocale('engb', enGbLocale);
defineLocale('de', deLocale);
defineLocale('es', esLocale);
defineLocale('fr', frLocale);
defineLocale('zhcn', zhCnLocale);
defineLocale('ru', ruLocale);

/*
export function localeFactory(): string {
  return LocaleDatePipe.localeId;
}
*/

export function selectedLocaleFactory(): string {
  const localeService = new LocaleService();
  return localeService.getCurrentLanguage();
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    CoreModule,
    SharedModule,
    AppRoutingModule
  ],
  providers:
  [
    BsLocaleService,
    I18n,
    {
      provide: TRANSLATIONS,
      useFactory: (locale) => {
        locale = locale || 'en'; // default to english if no locale provided
        return require(`raw-loader!../locale/messages.${locale}.xlf`);
      },
      deps: [LOCALE_ID]
    },
    {
      provide: TRANSLATIONS_FORMAT,
      useValue: 'xlf'
    },
    {
      provide: LOCALE_ID,
      useFactory: selectedLocaleFactory
    }
  ],
  bootstrap: [AppComponent],
  entryComponents: [ConfirmationComponent]
})

export class AppModule { }

import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataService } from './services/data.service';

import { BsLocaleService } from 'ngx-bootstrap/datepicker';
import { LocaleService } from './services/locale.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit, OnDestroy {

  constructor(private dataService: DataService,
    private localeService: LocaleService,
    private bsLocaleService: BsLocaleService) { }

  ngOnInit() {

     ... nothing relevant
  }
}

应用程序组件.ts

import { TestBed, inject } from '@angular/core/testing';

import { DataService } from './data.service';
import { I18n } from '@ngx-translate/i18n-polyfill';

describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, I18n]
    });
  });

  it('should be created', inject([DataService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));
});

import { Injectable } from '@angular/core';
import { I18n } from '@ngx-translate/i18n-polyfill';


@Injectable({
  providedIn: 'root'
})
export class DataService {

  SOME_CONSTANT = this.i18n('Translate this text');

  constructor(private i18n: I18n, private authService: AuthService) {

    ...
  }

  public serviceMethod() {
    return ...
  }

}

declare var require: any;

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, LOCALE_ID, TRANSLATIONS, TRANSLATIONS_FORMAT } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { I18n } from '@ngx-translate/i18n-polyfill'; // polyfill to support i18n for text in .ts files (until supported by Angular)
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { LocaleService} from './services/locale.service';
import { SharedModule } from './shared/shared.module';
import { CoreModule } from './core/core.module';

defineLocale('engb', enGbLocale);
defineLocale('de', deLocale);
defineLocale('es', esLocale);
defineLocale('fr', frLocale);
defineLocale('zhcn', zhCnLocale);
defineLocale('ru', ruLocale);

/*
export function localeFactory(): string {
  return LocaleDatePipe.localeId;
}
*/

export function selectedLocaleFactory(): string {
  const localeService = new LocaleService();
  return localeService.getCurrentLanguage();
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    CoreModule,
    SharedModule,
    AppRoutingModule
  ],
  providers:
  [
    BsLocaleService,
    I18n,
    {
      provide: TRANSLATIONS,
      useFactory: (locale) => {
        locale = locale || 'en'; // default to english if no locale provided
        return require(`raw-loader!../locale/messages.${locale}.xlf`);
      },
      deps: [LOCALE_ID]
    },
    {
      provide: TRANSLATIONS_FORMAT,
      useValue: 'xlf'
    },
    {
      provide: LOCALE_ID,
      useFactory: selectedLocaleFactory
    }
  ],
  bootstrap: [AppComponent],
  entryComponents: [ConfirmationComponent]
})

export class AppModule { }

import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataService } from './services/data.service';

import { BsLocaleService } from 'ngx-bootstrap/datepicker';
import { LocaleService } from './services/locale.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit, OnDestroy {

  constructor(private dataService: DataService,
    private localeService: LocaleService,
    private bsLocaleService: BsLocaleService) { }

  ngOnInit() {

     ... nothing relevant
  }
}

更新

如果我更改

data.service.ts

以添加如下所示的翻译格式导入，则会出现不同的错误：

Error: Invalid provider for the NgModule 'DynamicTestModule' - only instances of Provider and Type are allowed, got: [DataService, AuthService, I18n, ?InjectionToken TranslationsFormat?, ...]

请尝试

{provide:TRANSLATIONS_FORMAT，useValue:'xlf'}

如下所示的

spec

文件：

 TestBed.configureTestingModule({
    providers: [DataService, AuthService, I18n, 
      {provide: TRANSLATIONS_FORMAT, useValue: 'xlf' }]
  });

请尝试

{provide:TRANSLATIONS_FORMAT，useValue:'xlf'}

如下所示的

spec

文件：

 TestBed.configureTestingModule({
    providers: [DataService, AuthService, I18n, 
      {provide: TRANSLATIONS_FORMAT, useValue: 'xlf' }]
  });

关于OP的答案，请参见@ShashankVivek的答案。如果随后出现与

翻译相关的错误，则需要：
describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, AuthService, I18n, 
        {provide: TRANSLATIONS_FORMAT, useValue: 'xlf' },
        {provide: TRANSLATIONS, useValue: 'xlf' }
      ]
    });
  });

关于OP的答案，请参见@ShashankVivek的答案。如果随后出现与翻译相关的错误，则需要：
describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, AuthService, I18n, 
        {provide: TRANSLATIONS_FORMAT, useValue: 'xlf' },
        {provide: TRANSLATIONS, useValue: 'xlf' }
      ]
    });
  });

在data.service.spec中的提供程序中添加U格式的翻译。ts@AjayReddy-谢谢，但它不起作用-请查看问题底部的我的更新添加翻译\u格式，位于data.service.spec中的providers中。ts@AjayReddy-谢谢，但它不起作用-请查看问题底部的我的更新