Tips and Tricks in a world of Mix



So I’ve started with Super starter for ionic angular template.


The problem was it was only english also it had i18n globalization multi lingual plugin

So I’ve found this and perfected it just a bit.


In ..\WebstormProjects\ionic3-angular4\src\pages\tutorial\tutorial.html

Added buttons getting the param of the language wanted :

<ion-header no-shadow>
    <ion-buttons end >
      <button ion-button (click)="translateTo('he')" color="primary">He</button>

    <ion-buttons end >
      <button ion-button (click)="translateTo('ru')" color="primary">Ru</button>

    <ion-buttons end >
      <button ion-button (click)="translateTo('he')" color="primary">He</button>

    <ion-buttons end *ngIf="showSkip">
      <button ion-button (click)="startApp()" color="primary">{{ 'TUTORIAL_SKIP_BUTTON' | translate}}</button>



And in ..\WebstormProjects\ionic3-angular4\src\pages\tutorial\tutorial.ts

I’ve encapsulated the code of  initialization for reuse when the button is hit, so actually all I am doing is reinitializing the language and saying to translate provider want language to use using the parameter I’ve got from clicking the button.

constructor(public navCtrl: NavController, public menu: MenuController, public translate: TranslateService) {


    (values) => {
      console.log('Loaded values', values);
      this.slides = [
          title: values.TUTORIAL_SLIDE1_TITLE,
          description: values.TUTORIAL_SLIDE1_DESCRIPTION,
          image: 'assets/img/ica-slidebox-img-1.png',
          title: values.TUTORIAL_SLIDE2_TITLE,
          description: values.TUTORIAL_SLIDE2_DESCRIPTION,
          image: 'assets/img/ica-slidebox-img-2.png',
          title: values.TUTORIAL_SLIDE3_TITLE,
          description: values.TUTORIAL_SLIDE3_DESCRIPTION,
          image: 'assets/img/ica-slidebox-img-3.png',



That easy. Now you are ready for the global world. 🙂








Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Tag Cloud

%d bloggers like this: