переменные кнопки выбора иона

Question

Я использую ion-select и хочу, чтобы мое приложение делало это на нескольких языках. Я сделал массив, заполненный всеми ярлыками, используемыми в моем приложении. И я пытаюсь изменить переменные okText и cancelText. Я не знаю, как это сделать, если кто-нибудь может мне помочь.

Код:

HTML

<div id="language-div">
<ion-item>
  <ion-label>{{ language.languageSelectLabel }}</ion-label>
  <ion-select name="language" [selectedText]="selectcategory" [(ngModel)]="selectcategory"
    (ionChange)="codeSelected()" [okText]="{{ language.languageSelectLabel }}" cancelText="Dismiss">
    <ion-select-option value="1">{{ language.spanishSelectLabel }}</ion-select-option>
    <ion-select-option value="2">{{ language.englishSelectLabel }}</ion-select-option>
  </ion-select>
</ion-item>

Язык классов

export class Language {

public username: String;
public password: String;
public loginButtonLabel: String;
public languageSelectLabel: String;
public spanishSelectLabel: String;
public englishSelectLabel: String;
public okButtonLabel: String;
public cancelButtonLabel: String;

public static arrayLanguage: Language[] = [];

//public english: Language = new Language();

constructor() {
}

public static createLanguageObj() {
    //Labels spanish
    let spanish: Language = new Language();
    spanish.username = "usuario";
    spanish.password = "contraseña";
    spanish.loginButtonLabel = "Iniciar Sesion";
    spanish.languageSelectLabel = "Idioma";
    spanish.englishSelectLabel = "Inglés";
    spanish.spanishSelectLabel = "Español";
    spanish.okButtonLabel = "Vale";
    spanish.cancelButtonLabel = "Cancelar";

    Language.arrayLanguage.push(spanish);

    //Labels english
    let english: Language = new Language();
    english.username = "username";
    english.password = "password";
    english.loginButtonLabel = "Login";
    english.languageSelectLabel = "Language";
    english.englishSelectLabel = "English";
    english.spanishSelectLabel = "Spanish";
    english.okButtonLabel = "OK";
    english.cancelButtonLabel = "Cancel";

    Language.arrayLanguage.push(english);
}}

Login.ts

 codeSelected() {
switch (this.selectcategory) {
  case "1":
    this.language = Language.arrayLanguage[0];
    this.selectcategory = this.language.spanishSelectLabel;
    break;
  case "2":
    this.language = Language.arrayLanguage[1];
    this.selectcategory = this.language.englishSelectLabel;
    break;
}

Answer 1

В вашем коде была небольшая ошибка, это была интерполяция, смешанная с привязкой свойства в "okText", и, наконец, привязка должна быть к свойству okButtonLabel, я исправил это:

.html

<div id="language-div">
     <ion-item>
        <ion-label>{{ language.languageSelectLabel }}</ion-label>
        <ion-select name="language" [selectedText]="selectcategory" [(ngModel)]="selectcategory" (ionChange)="codeSelected()" okText="{{ language.okButtonLabel }}" cancelText="{{language.cancelButtonLabel}}">
                <ion-select-option value="1">{{ language.spanishSelectLabel }}</ion-select-option>
                <ion-select-option value="2">{{ language.englishSelectLabel }}</ion-select-option>
        </ion-select>
    </ion-item>
</div>

Мой file.ts для проверки:

constructor() {
  Language.createLanguageObj();
  //preset the first one
  this.language=Language.arrayLanguage[0];
}

codeSelected() {
    switch (this.selectcategory) {
      case "1":
        this.language = Language.arrayLanguage[0];
        this.selectcategory = this.language.spanishSelectLabel;
        break;
      case "2":
        this.language = Language.arrayLanguage[1];
        this.selectcategory = this.language.englishSelectLabel;
        break;
    }

Надеюсь, это поможет!