Change language using alert

@MaryamAzman wrote:

Hey guys, I wanted to change the variable #English to #Indonesia in a different div. I am using ion-select within an alertoptions. I’m trying to change my language from english to indonesia without using ng-translate because it will change the language for whole app.
Here’s my code:

.html

<ion-header>

  <ion-navbar color="finpalGreen">
    <ion-row>
        <ion-title >Funding Contract</ion-title>
           
            <ion-buttons end>
                <button ion-button icon-end (click)="changeLanguage()">
                  <span>{{language}}</span>
                  <ion-icon name="arrow-dropdown" color="dark"></ion-icon>
                </button>
            </ion-buttons>
              
        
    </ion-row>
  </ion-navbar>

</ion-header>
<ion-content  >
<div #English> <!-- english ver -->
        <div padding style="border-bottom:1px solid lightgray; ">
            <div style="padding-bottom: 10px;">
                <span class="span-top">english</span>
            </div>
         </div>
   </div>
         
          <div #Indonesia><!-- indonesia version -->
              <div padding style="border-bottom:1px solid lightgray; ">
                  <div style="padding-bottom: 10px;">
                    <span class="span-top">Indonesia</span>
                  </div>
                </div>
          </div>
</ion-content>

.ts

import { Component, ViewChild, Input, ElementRef } from '@angular/core';

import { IonicPage, ViewController, LoadingController, Content, NavParams, AlertOptions, AlertController} from 'ionic-angular';

export class FundingContractPage {

@ViewChild('English') English: ElementRef;
@ViewChild('Indonesia') Indonesia: ElementRef;

language: string;

constructor(private alertCtrl: AlertController){}

changeLanguage(){
    let alertOptions: AlertOptions = {
      title: 'Language',
      inputs: [ {
        type: 'radio',
        label:  'English',
        value:  'en',
        checked: this.language == 'en'
        
      }, {
        type: 'radio',
        label: 'Indonesia',
        value: 'id',
        checked: this.language == 'id'
      } ],
      buttons: [ {
        text: 'Cancel'
      }, {
        text: 'OK',
        handler: selectedLanguage => {
          this.language = selectedLanguage;
          if(this.language == 'en'){
            console.log("english");
            this.English.nativeElement;
          }else{
            console.log("indonesia");
            this.Indonesia.nativeElement;
          }
        }
      } ]
    };
    
    this.alertCtrl.create(alertOptions).present();
    
  }


 

}

How can I get it to present in front of my modul page? Thanks in advanced

Posts: 1

Participants: 1

Read full topic