angular – ngx-translate：在单元测试中翻译字符串

发布时间：2020-12-17 17:34:17 所属栏目：安全来源：网络整理

导读：如果它是静态测试,我可以获得值,但每当我试图获得翻译的值(使用ngx-translate)时,它都是空的. div id="header-title" h1{{ 'MENU_TITLE' | translate | uppercase }}/h1/div 这工作并返回测试 div id="header-title" h1Test/h1/div spec.ts it('should trans

如果它是静态测试,我可以获得值,但每当我试图获得翻译的值(使用ngx-translate)时,它都是空的.

<div id="header-title">
    <h1>{{ 'MENU_TITLE' | translate | uppercase }}</h1>
</div>

这工作并返回测试

<div id="header-title">
    <h1>Test</h1>
</div>

spec.ts

it('should translate a string using the key value',() => {
    fixture = TestBed.createComponent(NavComponent);
    const title = fixture.nativeElement;
    console.log(title.querySelector('#header-title h1').innerHTML);
});

导入翻译模块

beforeEach(async(() => {
        TestBed.configureTestingModule({
            imports: [RouterTestingModule,TranslateModule.forRoot({
                    loader: {
                        provide: TranslateLoader,useFactory: HttpLoaderFactory,deps: [HttpClient]
                    }
                }),HttpClientModule
            ],declarations: [NavComponent]
        }).compileComponents();

        injector = getTestBed();
        translate = injector.get(TranslateService);
    }));

—–固定—–但不确定这是否是正确的方法

let fixture: ComponentFixture<NavComponent>;

it('should translate a string using the key value',() => {
    fixture.detectChanges() // fixture = TestBed.createComponent(NavComponent);
    const title = fixture.nativeElement;
    console.log(title.querySelector('#header-title h1').innerHTML);
});

解决方法

找到了在单元测试中翻译密钥的解决方案

首先,检查textContent是否等于翻译键.然后为该键设置翻译并再次检查它是否已翻译：

it('should translate a string using the key value',async(() => {
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('#header-title h1').textContent).toEqual('MENU_TITLE');
    translate.setTranslation('en',{ MENU_TITLE: 'reporting' });
    translate.use('en');
    fixture.detectChanges();
    expect(compiled.querySelector('#header-title h1').textContent).toEqual('REPORTING');
}));

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!