从字符串到数字的离子类型转换答案

【问题标题】：Ionic type conversion from string to number从字符串到数字的离子类型转换
【发布时间】：2019-05-30 02:57:54
【问题描述】：

总的来说，我对 ionic 和移动开发非常陌生，我正在开发一个项目，该项目在 ionic 段中具有带有字符串值的属性。此离子段包含两个离子段按钮，一个按钮的值为“1”表示“是”，另一个按钮的值为“2”表示“否”。当用户点击“是”按钮时，如果用户点击“否”，则启用评论部分按钮评论部分被禁用。此属性值使用 ngModel 绑定到模型页面上的属性。然后，在提交有效负载时，该属性值需要在 JSON 有效负载中提交到后端时转换为数字值。我发现如果我只是将这个属性声明为一个数字，它会破坏注释启用/禁用功能，并且在提交值时它仍然会将该属性作为字符串值发送。我正在寻找一种在提交 JSON 有效负载时将属性值从字符串转换为数字的方法。

这是我目前拥有的：

属性值，在名为 formPS4588 的模型页面上声明

public safeWorkPracticesWereDemonstrated: any = '0';

HTML 文件

<ion-item-group>
    <ion-item-divider class="form-header">
      Safe Work Practices`
    </ion-item-divider>
    <ion-item>
        <p>
            S42 Safe work practices were demonstrated
        </p>
        <ion-segment [(ngModel)]="form.safeWorkPracticesWereDemonstrated">
            <ion-segment-button value="1" >Yes</ion-segment-button>
            <ion-segment-button value="2" (ionSelect)="tapSafeWorkPracticesNo()">No</ion-segment-button>
        </ion-segment>
    </ion-item>
    <ion-item>
        <ion-label stacked>Safe Work Practice Recognition</ion-label>
        <ion-textarea autoresize placeholder="Safe Work Practice Recognition" [disabled]="disableSafeWorkPractices()"
                      [(ngModel)]="form.safeWorkPracticeRecognition"></ion-textarea>
    </ion-item>
</ion-item-group>

TS 文件

public disableSafeWorkPractices(): boolean {
    return (this.form as FormPS4588).safeWorkPracticesWereDemonstrated !== '1';
}


private submitForm(): void {
    console.log('submitForm()');
    this.form.updateObservationTimeTo();

    let safeWorkPracticesWereDemonstrated = this.formPS4588.safeWorkPracticesWereDemonstrated;

    this.formPS4588.change(safeWorkPracticesWereDemonstrated);

    this.observation.confirmSubmitted();

    this.backendService.postObservation(this.observation, this.form).then((result) => {
        console.log(result);

        this.scheduledObservation.confirmSubmitted();

        this.loadingCtrl.create({
            content: result,
            duration: 1000
        }).present();

        this.exitForm();
    });
}

转换函数，在名为formPS4588的模型页面上声明

public change(safeWorkPracticesWereDemonstrated: any): void {
    Number(safeWorkPracticesWereDemonstrated);
}

【问题讨论】：

标签： ionic-framework ionic3

【解决方案1】：

你做错的是你实际上并没有改变价值。而不是这个：

this.formPS4588.change(safeWorkPracticesWereDemonstrated);

你应该这样做：

this.safeWorkPracticesWereDemonstrated = Number(safeWorkPracticesWereDemonstrated);

【讨论】：

您好，感谢您的回复，但是当我实施建议的更改时，尝试提交 JSON 有效负载时出现错误，错误是 TypeError:null is not an object(evalating 'this.formPS4588. safeWorkPracticesWereDemonstrated')
我想我应该澄清一下 submitForm() 函数是在名为 baseForm 的父打字稿文件上声明的。这个 baseForm 文件是可以提交的 4 个不同表单选项的父类。这些子表格之一是表格PS4588。这是唯一包含属性 safeWorkPracticesWereDemonstrated 的表单，需要在提交时将其从字符串转换为数字。

【解决方案2】：

我相信当用户点击提交按钮提交表单时，我能够通过绑定属性值的转换函数来实现解决方案。

<ion-item-group padding>
    <button ion-button block [disabled]="!isObservationCriteriaMet()" (tap)="doSubmit(); change();">Submit</button>
</ion-item-group>

public change(): void {

    (this.form as FormPS4588).safeWorkPracticesWereDemonstrated = Number((this.form as FormPS4588).safeWorkPracticesWereDemonstrated);

}

【讨论】：