Angular 使用ng2 translate的单元测试不断失败

正常运行应用程序时一切正常。然而，我在尝试编写这些单元测试时遇到了一些问题。我从下面的代码中删除了任何特定于项目的代码/类

我得到的错误是

Chrome 51.0.2704（Mac OS X 10.11.6）应用程序：a 声明异常失败 TypeError:无法读取AngularAppComponent.translationConfig上未定义的属性“setDefaultLang” （/Users/angular/dist/app/angular.component.js:40:23）

非常感谢您的帮助

我在main.ts中启动了它

bootstrap(ImeetSiteAngularAppComponent, [
  disableDeprecatedForms(),
  provideForms(),
  HTTP_PROVIDERS,
  { 
    provide: TranslateLoader,
    useFactory: (http: Http) => new TranslateStaticLoader(http, 'app/shared/i18n', '.json'),
    deps: [Http]
  },
  TranslateService
  ])

这是我的angular.component.ts

import { Component, ViewContainerRef } from '@angular/core';
import { HTTP_PROVIDERS } from '@angular/http';
import { RouteConfig, ROUTER_DIRECTIVES, Router, ROUTER_PROVIDERS} from '@angular/router-deprecated';

import {MODAL_DIRECTVES, BS_VIEW_PROVIDERS} from 'ng2-bootstrap/ng2-bootstrap';

import { HttpService } from './services/api/http.service';
import { TranslateService } from 'ng2-translate/ng2-translate';

import { Utils } from './shared/utilities/utils';

import { LoggedInRouterOutlet } from './shared/LoggedInRouterOutlet';
@Component({
  moduleId: module.id,
  selector: 'angular-app',
  templateUrl: 'angular.component.html',
  styleUrls: ['styles/main.css'],
  viewProviders: [BS_VIEW_PROVIDERS],
  providers: [
              HttpService, 
              HTTP_PROVIDERS, 
              ROUTER_PROVIDERS, 
              MODAL_DIRECTVES, 
              Utils, 
              TranslateService],
})

export class AngularAppComponent {
  viewContainerRef: ViewContainerRef;
  title = 'angular works!';
  translate: TranslateService;

  constructor(viewContainerRef:ViewContainerRef, translate:TranslateService) {
    console.log('App.component');
    this.viewContainerRef = viewContainerRef;
    this.translate = translate;
    this.translationConfig();
  }

  translationConfig() {   
    var userLang = navigator.language.split('-')[0]; // use navigator lang if available
    userLang = /(de|fr|en)/gi.test(userLang) ? userLang : 'en';
    this.translate.setDefaultLang('en'); //set default lang
    this.translate.use(userLang); //use lang if found
  }
}

这是我的angular.component.spec.ts

import {
  beforeEachProviders,
  describe,
  expect,
  it,
  inject,
  async
} from '@angular/core/testing';
import { ViewContainerRef, provide } from '@angular/core';
import { AngularAppComponent } from '../app/angular.component';
import { HTTP_PROVIDERS, XHRBackend,ConnectionBackend, Http, BaseRequestOptions } from '@angular/http';
import { MockBackend, MockConnection } from '@angular/http/testing';
import { TranslateService, TranslateLoader, TranslateStaticLoader } from 'ng2-translate/ng2-translate';

beforeEachProviders(() => [
        AngularAppComponent, 
        ViewContainerRef, 
        HTTP_PROVIDERS,
        { 
          provide: TranslateLoader,
          useFactory: (http: Http) => new TranslateStaticLoader(http, 'app/shared/i18n', '.json'),
          deps: [Http]
        },
        TranslateService,
        provide(XHRBackend, { useClass: MockBackend })
        ]);

describe('App: ImeetSiteAngular', () => {
  let viewContainerRef: ViewContainerRef;
  let translate: TranslateService;
  let app = new AngularAppComponent(viewContainerRef, translate);

  it('should create the app', () => {
    console.log('app is truthy')
    expect(app).toBeTruthy();
  });

  it('should have as title \'angular works!\'',() => {
    console.log('app has a title')
    expect(app.title).toEqual('angular works!');
  });
});

---

我找到了解决这个问题的办法

import { Component, ViewContainerRef, OnInit } from '@angular/core';
import { HTTP_PROVIDERS } from '@angular/http';
import { RouteConfig, ROUTER_DIRECTIVES, Router, ROUTER_PROVIDERS} from      '@angular/router-deprecated';

import {MODAL_DIRECTVES, BS_VIEW_PROVIDERS} from 'ng2-bootstrap/ng2-bootstrap';

import { HttpService } from './services/api/http.service';
import { TranslateService } from 'ng2-translate/ng2-translate';

import { Utils } from './shared/utilities/utils';

import { LoggedInRouterOutlet } from './shared/LoggedInRouterOutlet';
@Component({
  moduleId: module.id,
  selector: 'angular-app',
  templateUrl: 'angular.component.html',
  styleUrls: ['styles/main.css'],
  viewProviders: [BS_VIEW_PROVIDERS],
  providers: [
              HttpService, 
              HTTP_PROVIDERS, 
              ROUTER_PROVIDERS, 
              MODAL_DIRECTVES, 
              Utils, 
              TranslateService],
})

export class AngularAppComponent implements OnInit{
  viewContainerRef: ViewContainerRef;
  title = 'angular works!';

  constructor(viewContainerRef:ViewContainerRef, public translate:TranslateService) {
    console.log('App.component');
    this.viewContainerRef = viewContainerRef;
  }

  ngOnInit(): void{   
    var userLang = navigator.language.split('-')[0]; // use navigator lang if available
    userLang = /(de|fr|en)/gi.test(userLang) ? userLang : 'en';
    this.translate.setDefaultLang('en'); //set default lang
    this.translate.use(userLang); //use lang if found
  }
}

---

我所做的是从@angular/core导入OnInit，在构造函数中公开translate，并调用setDefaultLang并在ngOnInit函数中使用。

我也有同样的问题。你找到解决办法了吗？