关于javascript：ion-datetime：如何在没有时间戳的情况下获取日期值？


ion-datetime: How to get date value without timestamp?

我使用NgModel在ionic4中使用ion-datetime绑定到属性，但是，无论我在格式中包含哪些选项，我总是会获得包含时间戳记的时间。 如何从结果中删除时间戳，以便我的媒体资源的最终值类似于``2019-04-22''而不是``2019-04-22T08：45：41.243-05：00''？

我尝试过：但是，我仍然得到时间戳记

1
 <ion-datetime max="2030" min="2019" [(ngModel)]="mydate" display-format="MMM DD, YYYY"></ion-datetime>

我希望结果像是：" 2019-04-22"，但我不断得到：" 2019-04-22T08：45：41.243-05：00"

相关讨论

如果只想要日期，那么我认为split()方法可能会起作用，因为我们从ion-datetime获得的值是一个字符串。因此，我们使用split方法将字符串拆分并转换为数组，然后可以获得date或time您想要借助index进行的操作如下：

1
2
3
     var dateFormat = mydate.split('T')[0];
     console.log(dateFormat);
     // 2019-04-22

您可以使用Moment.js格式化日期。

1
2
3
4
5
6
7
<ion-datetime displayFormat="MMM DD, YYYY" max="2030" min="2019" [(ngModel)]="mydate" (ionChange)="doSomething(this.mydate)"></ion-datetime>

import * as moment from 'moment';

doSomething(date) {
   console.log('date', moment(date).format('YYYY-MM-DD')); // 2019-04-22
}
相关讨论

您可以使用moment.js

在您的file.page.html中

1
    <ion-datetime [(ngModel)]="mydate" placeholder=""></ion-datetime>

在您的file.page.ts中

1
2
3
4
5
6
7
8
9
import moment from 'moment';

<!-- to pass data to your API -->
mydate = moment(mydate).format('YYYY-MM-DD');

<!-- to view in console -->
yourFunction(mydate) {
    console.log('date', moment(mydate).format('YYYY-MM-DD'));
}

可能这个答案有帮助。我知道找到我们正在寻找的答案可能会令人沮丧。

您可以使用自定义选择器选项来设置自定义按钮，它返回一个对象，其中所有变量都位于单独的键中，因此可以更轻松地编辑所需的显示方式

为此，您可以将其插入ion-datetime

[pickerOptions]="customPickerOptions"

并在您的.ts文件中

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
this.customPickerOptions = {
            buttons: [
                {
                    text: 'Save',
                    handler: (time) => {
                        console.log('time', time);
                    }
                },
                {
                    text: 'Cancel',
                    handler: e => {
                        modalCtrl.dismiss(e)
                    }
                }
            ]
        }

希望这可以帮助

Edit2：toLocaleFormat不被广泛接受。这是关于替代品的文章。您可以将其拆分为T。

1
2
3
4
const dateArray = fullDateString.split('T');
if (dateArray.length > 0){
    const partYouWant = dateArray[0];
}

编辑：从离子文档

It's also important to note that neither the displayFormat or
pickerFormat can set the datetime value's output, which is the value
that is set by the component's ngModel. The format's are merely for
displaying the value as text and the picker's interface, but the
datetime's value is always persisted as a valid ISO 8601 datetime
string.

这是一个更好的答案：

1
2
const dateObject = new Date(this.mydate);
const dateString = dateObject.toLocaleFormat('%Y-%m-%d');

new Date的输入可以是日期字符串，定义为：

String value representing a date. The string should be in a format
recognized by the Date.parse() method (IETF-compliant RFC 2822
timestamps and also a version of ISO8601).

我猜您正在尝试访问代码中的this.mydate。

您有几种选择，最好用此堆栈溢出文章来表示。

1
this.mydate.toLocaleFormat('%Y-%m-%d');

此函数将使用一个Date对象，并将其转换为您请求的格式的字符串。您可以在选项中放入所有选项。

上面的堆栈溢出文章中还显示了许多其他选项。

相关讨论