2016-04-26 12 views
6

मैंने आयनिक 2 में बैक बटन का नाम बदल दिया है, लेकिन क्या कोई जानता है कि आप इस बटन को ng2-translate के साथ कैसे अनुवाद कर सकते हैं?बैक बटन का अनुवाद करें Iionic 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']); 
    }); 
} 

यह तैयार में इस सेट करने के लिए आवश्यक है -फंक्शन क्योंकि स्थानीयकरण एसिंक लोड करता है और यह वह स्थान है जहां आप जानते हैं कि स्थानीयकरण फ़ाइलों को लोड किया गया है और मॉड्यूल काम करने के लिए तैयार है।

जाहिर है मैं ui.general.back के तहत उचित json-फाइलों में अनुवाद पाठ की स्थापना की है;)

आप अभी तक config एक्सेस नहीं किया है, तो आप इसे आयात करने की आवश्यकता:

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

बढ़िया है, यह काम करता है। मुझे कन्स्ट्रक्टर 'प्राइवेट कॉन्फ़िगरेशन' में भी जोड़ना पड़ा था: कॉन्फ़िगरेशन – Guus

+0

एक्शन शीट्स जैसे घटक टेक्स्ट का अनुवाद करने के लिए भी काम करता है –

+2

तीर को केवल एंड्रॉइड की शैली रखने के लिए, इस आईओसीजी को इस .config.set में पहले पैरामीटर के रूप में जोड़ें: 'यह .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} 
]}) 
संबंधित मुद्दे