Ionic中使用DateTime当作数字选择器

CTO教的一种方法,作为小白只能先尽量理解记录下来。

ion-datetime是Ionic中已有的组件,使用其作数字选择器可避免我们自己再重新构造一个组件。

在html中,先定义一个"datePickerValue"作为view和component的连接(ngModel用了双括号)。

在对应的ts文件里,先把"datePickerValue"定义成string类型:
public datePickerValue: string;
CTO给我讲的思路是这样的:

  1. 打开界面时首先是用户看到的东西,所以要把用户看到的(这里是数字)转换成DatePicker可识别的“时间”
    public ionViewDidLoad() {
    let datePickerDate = new Date();
    datePickerDate.setMinutes(this.auditProduct.facingsAudit);
    this.datePickerValue = datePickerDate.toISOString();
    }
    把用户看到的数字给datePickerDate当作分钟,再转换成ISOS标准格式给datePickerValue从而给DatePicker。
  2. 在此过程中,其实用户一直浏览的“分钟”而非“数字”,但这并不影响什么;直到用户要把选中的“分钟”保存的时候,此时保存的应该是“数字”,所以要再把组件中的“分钟”转换成“数字”。
  3. r
    public saveProductData() {
    this.auditProduct.facingsAudit = new Date(this.datePickerValue).getMinutes();
    }

这就可以啦。

你可能感兴趣的:(Ionic)