离子选择返回格式答案

【问题标题】：Ionic Select Return Formatting离子选择返回格式
【发布时间】：2019-01-17 00:22:13
【问题描述】：

我在使用 ionic 3 时遇到了以下问题。我正在使用 <ion-select> 块并使用 ngModel="x"。如果我想将此值打印到我的控制台，它会使用换行符和许多空格来打印它。我用“e”替换了所有换行符，用“a”替换了所有空格。输出现在看起来像这样：
输出：eaaaaaaaaaaOutputeaaaaaaaaaa

【问题讨论】：

您可以用空字符串替换所有换行符、空格，以保持输入字符串的格式。 msg = msg.replace('\/n','');
您能否向我们展示您的完整代码或完整示例来重现您的问题？根据您的实现，不应有空格或换行符...

标签： javascript angular typescript ionic-framework ionic3

【解决方案1】：

下面是我的代码：

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

【讨论】：