Question

我的模板中有时间选择器和日期选择器。这些值作为一个数字字符串一起存储到我的数据库中，因此当我将它们插入到不同页面上所需位置的模板中时，我必须执行一些步骤以正确的格式将它们相互解析。首先，我调用格式化函数来分隔值，然后通过角度矩管道运行它，将军事时间转换为标准的12小时时间。

我注意到，当我选择时间时，例如时间选择器上的7:00或12:00，它会在7:08或12:08内插到我的模板。为什么要添加分钟？

这就是我如何保存数据库的日期和时间

constructor(//controllers n stuff) {

//empty event object

      this.event = {
        hostName : "",
        hostId: "",
        hostPhoto : "",
        coverCharge: 0,
        drinkMin: false,
        reimburse: false,
        venue : "",
        guests : 0,
        date : "", 
        time : "",
        city : "",
        eventTime : "",
        createdTime: "",
        volunteers : 0 

      } 
}//close constructor 

addEvent(){

    let authData = OnymosAccess.getAuth(); //GET DATABASE AUTH
            this.event.hostName = authData.userName;
            this.event.hostId = authData.userId; 
            this.event.hostPhoto = authData.userPhoto();
          **this.event.eventTime = new Date(this.event.date + " " + this.event.time).getTime();**
            this.event.createdTime = Date.now();

            let that = this;

                OnymosUtil.addData( //SEND TO DATABASE

        '/events/' + this.event.city + '/' + this.event.createdTime,
                        this.event,

        function optionalSuccessCallback (statusMessage) {
                            console.log(statusMessage);

                            that.saveStatus = "successfully saved";
                         },

            function optionalFailureCallback (error) {

                            that.saveStatus = "failed saving" + error;
                        });
}//end addEvent

HTML模板

<ion-row>
                <ion-col>
                    <ion-icon name="calendar"></ion-icon>
                    <BR>
                    **{{getFormattedTime(event.eventTime, 'MM-dd-yyyy')}}** 
                </ion-col>
                <ion-col>
                    <ion-icon name="clock"></ion-icon>
                    <BR> 
                    **{{ getFormattedTime(event.eventTime,'HH:MM' ) | amParse:'HH:mm' | amDateFormat:'hh:mm A' }}**

                </ion-col>

获得格式化时间功能我在使用时间之前运行时间。

getFormattedTime (time, format) {
        var t = new Date(time);
        var tf = function (i) { return (i < 10 ? '0' : '') + i };
        return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
            switch (a) {
                case 'yyyy':
                    return tf(t.getFullYear());

                case 'MM':
                    return tf(t.getMonth() + 1);

                case 'mm':
                    return tf(t.getMinutes());

                case 'dd':
                    return tf(t.getDate());

                case 'HH':
                    return tf(t.getHours());

                case 'ss':
                    return tf(t.getSeconds());

            }
        })
    } // end of getFormattedTime

Answer 1

<ion-col>
     <ion-icon name="calendar"></ion-icon>
     <BR>
     **{{getFormattedTime(event.eventTime, 'MM-dd-yyyy')}}** 
</ion-col>
<ion-col>
     <ion-icon name="clock"></ion-icon>
     <BR> 
     **{{ getFormattedTime(event.eventTime,'HH:mm' ) | amParse:'HH:mm' | amDateFormat:'hh:mm A' }}**
</ion-col>

您必须使用getFormattedTime(event.eventTime,'HH:mm' )。在您使用的代码getFormattedTime(event.eventTime,'HH:MM' ) MM将返回月份

MM - 月， mm - 分钟

Answer 2

我使用了您的代码并在此处进行了尝试。您可以查看以下代码段。您在代码中使用new Date(this.event.date + " " + this.event.time).getTime()。它工作正常。你也可以直接new Date(this.event.date + " " + this.event.time)而不用.getTime()。

您似乎执行了'HH:MM'，而不是'HH:mm'。在代码中纠正它并尝试它。

＆＃13;

function getFormattedTime (time, format) {
        var t = new Date(time);
        var tf = function (i) { return (i < 10 ? '0' : '') + i };
        return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
            switch (a) {
                case 'yyyy':
                    return tf(t.getFullYear());

                case 'MM':
                    return tf(t.getMonth() + 1);

                case 'mm':
                    return tf(t.getMinutes());

                case 'dd':
                    return tf(t.getDate());

                case 'HH':
                    return tf(t.getHours());

                case 'ss':
                    return tf(t.getSeconds());

            }
        })
    }
    
    var time=new Date("2017-07-05 07:00").getTime();
    console.log(time);
    console.log( getFormattedTime(time, 'MM-dd-yyyy'));
    console.log(getFormattedTime(time,'HH:mm' ));

＆＃13;

Answer 3

您的代码存在的问题是您使用的大写MM映射到t.getMonth()而不是小写mm（分钟）。

无论如何，由于您正在使用momentjs，我建议您使用解析时间getFormattedTime（moment(Number)解析毫秒数）和format()来更改YYYY。

请注意，使用我的代码，您必须使用时刻标记（大写DD表示年份，大写function getFormattedTime(time, format) { return moment(time).format(format); } console.log( getFormattedTime(1499200000000, 'MM-DD-YYYY') ); console.log( getFormattedTime(1499200000000, 'HH:mm') );表示月份日期。

这是一个实例：

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

＆＃13;

   +-----------------------+
   |   id | unix_timestamp |
   +-----------------------+
   |    1 |   1000         |
   |    2 |   1001         |
   |    3 |   1002         |
   |    4 |   1003         |
   |   11 |   1000         |
   |   12 |   1001         |
   |   13 |   1002         |
   |   14 |   1003         |
   +-----------------------+

＆＃13;

为什么我的时间/日期选择器格式化添加分钟？

3 个答案: