2016-09-20 21 views
9

Angular2 ile bileşen testi üzerinde çalışıyorum. Html şablonumda çeviri borusunu kullanıyorum.'Translate' borusu bulunamadı, açısal2 bileşen testi

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'); 
}); 

}); 

i got tercüme boru bilinmemektedir bu hata:

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"): [email protected]: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"> 
"): [email protected]:16 
    The pipe 'translate' could not be found (" 
    </tr> 
    <tr *ngFor="let right of rights"> 
     <td>[ERROR ->]{{right.name | translate}}</td> 
    </tr> 
</table> 

Biz bu sorunun çözümü nasıl Bu testin kodudur?

Teşekkürler.

+0

o angular2 tarafından özel bir boru veya çeviri hizmeti nedir? – micronyks

+0

ng2 translate https://github.com/ocombe/ng2-translate – user3518668

cevap

12

Bunu size gerçek uygulama ile kütüphane yapılandırmak olurdu gibi kütüphane modülü ile TestBed yapılandırmanız gerekir github.com/ocombe/ng2-translate

NG2-translate var. Bir modül yapılandırma: Ve documentation bakarak, bu yüzden TestBed yapılandırmasında aynı yapmalıdır modülünü

imports: [ 
    TranslateModule.forRoot() 
] 

ithal ederek yapılandırmaya gösterir

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

Bu TestBed.configureTestingModule için budur test ortamı için. Ile

+0

Teşekkür ederim çalışıyor! – user3518668

+0

Bu beni saatlerce öldürüyordu. Çeviri borusunu kullanan bir bileşeni test etmeye çalışıyordum. Modülü .forRoot() olmadan içe aktarmayı denedi ve işe yaramadı. – jpgrassi

+0

Bu cevap bana doğru cevabı verdi. Bununla birlikte, PipesModule'imi test paketine aktarırken, test çalışmasını yavaşlatan, ihtiyaç duymadığım bir boru ithal ettim. İadeler bölümüne sadece ihtiyacım olan spesifik boruyu ithal ederek en iyi çözümü aldım. Buradaki rehberlik için teşekkürler. – danday74

2

son Eğik Eğer teste istediğiniz bileşenin içine doğrudan bu uygulamaya ihtiyaç ngx-translate 4 uyumlu:

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 
    ... 
+0

Bu aradığım çözümdür, ancak sadece şunu sağladım: {provid: Http, useValue: true}, 'providers ' –

İlgili konular