离子选择返回格式

时间:2018-08-09 13:41:51

标签: javascript angular typescript ionic-framework ionic3

离子3遇到以下问题。我正在使用<ion-select>块并使用了ngModel="x"。如果要将此值打印到控制台,它将以换行符和许多空格打印出来。我将所有换行符替换为“ e”,并将所有空格替换为“ a”。现在的输出如下所示:
输出:eaaaaaaaaaaOutputeaaaaaaaaaa

1 个答案:

答案 0 :(得分:0)

在以下我的代码中:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
/**
 * Generated class for the AnkerstangePage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-ankerstange',
  templateUrl: 'ankerstange.html',
})
export class AnkerstangePage {

  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad AnkerstangePage');
  }

  public moertelChoosen : string = "VMU Plus";
  public kartuschengroesseChoosen: string;

  public stangen : string[] = [
    "M6",
    "M8",
    "M10",
    "M12",
    "M14",
    "M16",
    "M20",
    "M22",
    "M24",
    "M27",
    "M30",
    "M36"
  ];

  public moertel: string[] = [
    "VMU Plus",
    "VMH",
    "VME",
    "VM-EA",
    "VM-PY"
  ];

  public vmuPlus: number[] = [
    150,
    280,
    300,
    345,
    420,
    420,
    825
  ];

  public vmh: number[] = [
    280,
    345,
    420
  ];

  public vme: number[] = [
    385,
    585,
    1400
  ];

  public vmea: number[] = [
    300,
    345,
    420
  ];

  public vmpy: number[] = [
    300,
    410
  ];

  public kartuschengroesse = {
    "VMU Plus": this.vmuPlus,
    "VMH": this.vmh,
    "VME": this.vme,
    "VM-EA": this.vmea,
    "VM-PY": this.vmpy
  };

  public printVal(val: string){
    alert("moertel:" + val.replace("\n", "").replace("          ", ""));
  }

  public changeMoertel(val: string){
    //this.moertelChoosen = val.replace("\n", "");//.replace("          ", "");
    alert(this.moertelChoosen.replace("\n", "e").split(" ").join("a"));
  }

}
<ion-header>

  <ion-navbar>
    <ion-title>Ankerstange</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <h3>{{ "titelAllg" | translate }}</h3>
  <h4>{{ "titelAnkInn" | translate }}</h4>

  <ion-list>
    <ion-item>
      <ion-label> {{ "moertel" | translate }} </ion-label>
      <ion-select [(ngModel)]="moertelChoosen" [multiple]="false" (ionChange)="changeMoertel()">
        <ion-option *ngFor="let item of moertel">
          {{ item }}
        </ion-option>
      </ion-select>
    </ion-item>
    <ion-item>
      <ion-label>{{ "kartuschengroesse" | translate }}</ion-label>
      <ion-select [(ngModel)]="kartuschengroesseChoosen">
        <ion-option *ngFor="let size of kartuschengroesse[moertelChoosen]">
          {{ size }}
        </ion-option>
      </ion-select>
    </ion-item>
  </ion-list>

</ion-content>

不要奇怪这些词。它是德语代码:D