可变离子选择按钮

时间:2019-11-06 11:22:46

标签: angular ionic-framework

我正在使用ion-select,我希望我的应用程序可以使用多语言。我已经制作了一个数组,里面充满了muy应用中使用的所有标签。而且我正在尝试更改okText和cancelText变量。如果有人可以帮助我,我不知道该怎么做。

代码:

HTML

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);
}}

班级语言

 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;
}

Login.ts

class MatchViewset(viewsets.ViewSetMixin, generics.ListCreateAPIView):
    serializer_class = MatchSerializer

    def get_queryset(self):
        header_token = self.request.META.get('HTTP_AUTHORIZATION', None)
        print(header_token)
        if header_token is not None:
            try:
                token = sub('Token ', '', self.request.META.get('HTTP_AUTHORIZATION', None))
                token_obj = Token.objects.get(key=token)
                self.request.user = token_obj.user
            except Token.DoesNotExist:
                pass
        print(self.request.user)
        return Match.objects.filter(creator=self.request.user)


class MatchDetailViewset(generics.RetrieveUpdateDestroyAPIView):
    queryset = Match.objects.all()
    serializer_class = MatchSerializer

1 个答案:

答案 0 :(得分:0)

您的代码中有一个小错误,它是在插值中混合了“ 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;
    }

希望有帮助!