Không thể tìm thấy ống 'dịch', thử nghiệm thành phần góc 2

Question

Tôi đang thử nghiệm thành phần với angular2. trong mẫu html của tôi, tôi sử dụng ống dịch. Đây là mã của thử nghiệm:

import { ComponentFixture, TestBed ,getTestBed} from '@angular/core/testing'; 
import { By }    from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 
import { RightComponent } from './right.component'; 
import {TranslateService} from 'ng2-translate/ng2-translate'; 
import {Injector} from "@angular/core"; 
let comp: RightComponent; 
let fixture: ComponentFixture<RightComponent>; 
let el:  DebugElement; 
let translate: TranslateService; 
let injector: Injector; 

describe('testComponent',() => { 

beforeEach(() => { 
TestBed.configureTestingModule({ 
    declarations: [ RightComponent ] 
}); 

injector = getTestBed(); 
translate = injector.get(TranslateService); 
fixture = TestBed.createComponent(RightComponent); 

comp = fixture.componentInstance; // BannerComponent test instance 

// get title DebugElement by element name 
el = fixture.debugElement.query(By.css('h2')); 
}); 
it('should display original title',() => { 
fixture.detectChanges(); // trigger data binding 
expect(el.nativeElement.textContent).toContain('Liste des droits'); 
}); 

}); 

tôi đã nhận lỗi này ống các dịch vẫn chưa được biết:

Error: Template parse errors: 
The pipe 'translate' could not be found ("<h2>[ERROR ->]{{'RIGHT_TITLE' |  translate}}</h2> 
<div class="table-responsive"> 
<table id="rightTableId" clas"): RightComponent@0:4 
The pipe 'translate' could not be found (" 
    <table id="rightTableId" class="table table-striped"> 
    <tr> 
     <th>[ERROR ->]{{'NAME_LABEL' | translate}}</th> 
    </tr> 
    <tr *ngFor="let right of rights"> 
"): RightComponent@4:16 
    The pipe 'translate' could not be found (" 
    </tr> 
    <tr *ngFor="let right of rights"> 
     <td>[ERROR ->]{{right.name | translate}}</td> 
    </tr> 
</table> 

Làm sao chúng ta giải quyết vấn đề này?

Cảm ơn.

Answer 1

đó là ng2-dịch github.com/ocombe/ng2-translate

Bạn cần phải cấu hình TestBed với các module thư viện giống như bạn sẽ cấu hình các thư viện với ứng dụng thực tế của bạn. Và nhìn vào documentation, nó cho thấy cấu hình nó bằng cách nhập module

imports: [ 
    TranslateModule.forRoot() 
] 

Vì vậy, bạn nên thực hiện tương tự trong cấu hình TestBed

TestBed.configureTestingModule({ 
    declarations: [ RightComponent ], 
    imports: [TranslateModule.forRoot()] 
}); 

Đây là những gì TestBed.configureTestingModule dành cho: để cấu hình một module cho môi trường thử nghiệm.

Answer 2

Với mới nhất kiễu góc 4 tương thích ngx-translate bạn cần phải thực hiện điều này trực tiếp vào thành phần bạn muốn kiểm tra:

import {TranslateHttpLoader} from "@ngx-translate/http-loader"; 
import {Http, HttpModule} from "@angular/http"; 
import { 
    MissingTranslationHandler, 
    TranslateLoader, 
    TranslateModule, 
    TranslateService 
} from "@ngx-translate/core"; 

... 

export function HttpLoaderFactory(http: Http) { 
    return new TranslateHttpLoader(http, "./assets/i18n/", ".json"); 
} 

    ... 

    imports: [ 
       TranslateModule.forRoot({ 
        loader: { 
         provide: TranslateLoader, 
         useFactory: HttpLoaderFactory, 
         deps: [Http] 
        } 
       }) 
      ], 
    ... 

    providers: [ 
       TranslateService 
    ...