即时通讯在我的ionic2应用程序上使用ng2-translate,我在html上的静态文本上运行得很好,如:
<ion-title>{{ 'Inventory.view-header' | translate }}</ion-title>
我翻译了这个标题但是当我尝试翻译时:
<ion-item menuClose *ngFor="let p of pages" (click)="openPage(p)">
<ion-icon color="gray" name="{{p.icon}}" item-left></ion-icon>
{{p.title}}
</ion-item>
我无法将翻译管道的p.title翻译为离子标题。我只能做到:
this.translate.onLangChange.subscribe((event: LangChangeEvent) => {
this.pages[0].title = event.translations.Menu.pantry;
this.pages[1].title = event.translations.Menu.inventory;
...
但我不想为我要翻译的每个ngfor或数组都设置一个。有另一种方法可以使这项工作吗?
我在app.module上的conf:
import { TranslateStaticLoader, TranslateModule, TranslateLoader} from 'ng2-translate';
export function createTranslateLoader(http: Http) {
return new TranslateStaticLoader(http, './assets/i18n', '.json');
}
@NgModule({
declarations: [
MyApp,
...
],
imports: [
IonicModule.forRoot(MyApp),
TranslateModule.forRoot({
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [Http]
})
],
...
答案 0 :(得分:1)
正如您所说,p.title
的{{1}}值与pantry
,inventory
类似,那么您必须使用translate
管道,如下所示:
<ion-item menuClose *ngFor="let p of pages" (click)="openPage(p)">
<ion-icon color="gray" name="{{p.icon}}" item-left></ion-icon>
{{ 'Menu.' + p.title | translate }}
</ion-item>
答案 1 :(得分:0)
在这里,您可以使用TranslationPipe和TranslationService找到Ionic2 rc3的回购。 https://github.com/philipphalder/ionic2-rc3-NG2-Translate