2016-04-26 3 views
6

Я изменил название кнопки «Назад» в ионном 2, но кто-нибудь знает, как вы можете перевести эту кнопку с помощью ng2-translate?перевод обратно кнопка ionic 2

this.config.set('backButtonText', 'Go Back'); // < want to translate this with ng2-translate. 

ответ

9

Вы можете перевести обратно текст, как это (если вы уже успешно реализован модуль NG2-перевод) в вашем app.ts:

initializeApp() { 
    this.platform.ready().then(() => { 
     this.config.set('backButtonText', this.translate.get('ui.general.back')['value']); 
    }); 
} 

Это необходимо указывать в установить это в готовом -функция, потому что локализация загружает async, и это то место, где вы знаете, что файлы локализации загружены и модуль готов к работе.

Очевидно, что я поставил текст перевода в соответствующих JSON-файлов в ui.general.back;)

Если вы еще не получили доступ к конфигурации, то вам необходимо импортировать его:

import {..., Config} from 'ionic-angular'; 
+1

Отлично, это работает. Мне также пришлось добавить конструктор 'private config: Config' – Guus

+0

также работает для перевода текста компонента, например, листов действий. –

+2

Чтобы сохранить только стиль со стрелкой в ​​стиле android, добавьте 'ios' в качестве первого параметра в this.config.set: ' this .config.set ('ios', 'backButtonText', this.translate.get ('ui.general.back') ['value']); ' –

2

Вы можете перевести текст обратно, как это, положить на app.component.ts

ngAfterViewInit() { 
this.navCtrl.viewWillEnter.subscribe((view) => { 
    let parentView = this.navCtrl.getPrevious(view); 

    if (parentView) { 
    this.translate.get('nav.back.label').first().subscribe(
     moduleName => { this.navCtrl.getActive().getNavbar().setBackButtonText(moduleName); } 
    ); 
    } 
}); } 
+0

Это работает для меня. Красиво сделано :) –

1

я должен был использовать его как это (в app.component.ts)

this.platform.ready().then(() => { 
 
    this.translate.get('GENERIC.BACK').subscribe(backLabel => { 
 
    this.config.set('ios', 'backButtonText', backLabel); 
 
    }); 
 
});

1

В вас app.module.ts:

@NgModule({ 
declarations: [ 
    MyApp 
], 
imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp, { 
     platforms: { 
      ios: { 
       backButtonText: 'Voltar' 
      } 
     } 
    }), 
], 
bootstrap: [IonicApp], 
entryComponents: [ 
    MyApp 
], 
providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler} 
]}) 
Смежные вопросы