Ионный ярлык не показывает запятую - PullRequest
0 голосов
/ 12 мая 2018

Я хочу, чтобы мое ionic-приложение отображало данные в соответствии с языком устройства.В этом конкретном случае я развернул apk на эмуляторе Android с языком, выбранным как испанский.Однако вместо запятой (,) он показывает обычный десятичный знак (.), Как показано на следующем скриншоте.Как я могу это сделать, т.е. изменить формат в соответствии с языком устройства?

enter image description here

ts file:

import { Modal1Page } from './../modal1/modal1';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { parse, format, AsYouType } from 'google-libphonenumber';
import { AlertController,ModalController,Modal, ModalOptions } from 'ionic-angular';
import { ModalPage } from '../modal/modal';
import { Globalization } from '@ionic-native/globalization';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public inverse:boolean=false;
  public language:string='no value yet';

  constructor(public navCtrl: NavController,private alertCtrl: AlertController,private modalCtrl: ModalController,private globalization: Globalization) {

    this.globalization.getPreferredLanguage()
    .then(res => this.language=res.value)
    .catch(e => console.log(e));
  }
}

HTML:

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
    <ion-row>     
      <ion-label> I am installed on android device with language Spanish.</ion-label>
    </ion-row>
  <ion-row>
    <div >
      <div class="inner">
        <ion-label *ngIf="!inverse"  no-margin>1 USD = 67 INR</ion-label>
        <ion-label *ngIf="inverse" no-margin>1 INR = {{(1/67) | number }} USD </ion-label>
      </div>
      <button (click)="inverse=!inverse" ion-button clear class="iconWidth" color="dark">  <ion-icon name="swap" class="rotate"></ion-icon></button>
    </div>
  </ion-row>
<ion-row class="bottomRow">
  <p>Above row should show comma instead of decimal when inverse is clicked.Whats wrong there?</p>
  <ion-label> Thanks</ion-label>
</ion-row>
<ion-row>
  <ion-label>{{language}}</ion-label>
</ion-row>
</ion-content>

scss:

.rotate {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  margin-bottom: 15px;
  }

.inner{
  display: inline-block;
  width:70%;

  }
.iconWidth{
  width:20%;
  }

  .bottomRow
  {
    margin-top: -20px;
  }

Есть ли какая-то особая вещь, которую я должен упомянуть в файле HTML на своем ярлыке, чтобы определить текущие настройки устройства или язык.Спасибо за внимание.

1 Ответ

0 голосов
/ 12 мая 2018

Эта Github тема определенно поможет вам.

Вам необходимо включить Intl.js polyfill.

...