Bootstrap-datetimepicker 控件只显示时分秒

今天遇到一个比较恶心的需求吧，一道工序不可垮天，通过开始时间和结束时间计算工时，可是bootstrap中的时间控件很坑

 

贴上原链接  https://github.com/Eonasdan/bootstrap-datetimepicker

 

在github的demo中可以找到只显示时分秒的方法，先贴代码

首先是定义一个标签

wmsApp.directive(\'timepicker\', function ($parse) {
    return {
        restrict: \'A\',
        require: \'?ngModel\',
        link: function (scope, element, attrs, ngModelCtrl) {
            var picker = $(element).datetimepicker({
                format: \'HH:mm:ss\',
                useCurrent: false,
                showTodayButton: false,
                showClear: false,
                showClose: false,
                locale: moment.locale(\'zh-cn\')
            });

            //model->view
            ngModelCtrl.$render = function (value) {
                if (ngModelCtrl.$viewValue) {
                    $(element).data(\'DateTimePicker\').date(ngModelCtrl.$viewValue);
                } else {
                    $(element).data(\'DateTimePicker\').clear();
                }
            };

            //view->model
            picker.on(\'dp.change\', function (e) {
                if (e.date) {
                    ngModelCtrl.$setViewValue(new moment(e.date).format(\'YYYY-MM-DD HH:mm:ssZ\'));
                } else {
                    ngModelCtrl.$setViewValue(null);
                }
            });
        }
    };
});

　　

然后html中调用

 

<div class="form-group" ng-class="{ \'has-error\': editForm.startTime.$invalid && editForm.startTime.$dirty }">
                                            <label class="col-md-4 control-label"><font color="red">*</font> 开始时间：</label>
                                            <div class=\'col-md-8\'>
                                                <input type=\'text\' name="startTime" timepicker class="form-control" ng-model="model.StartTime" />
                                            </div>
                                        </div>

在input中使用新定义的 timepicker标签，效果就出来了

 

 

然后就是js中的接收了，也是很坑的地方，当我编辑完时间，点击保存，后台用js获取到了时间，但是。。。。

但是，获取的时间是“当天日期”+“我选定的时分秒”，也就是说，我不管数据的数据是哪一天的8:31，js拿到的都是我电脑当前日期的8:31，这个问题是因为在定义标签的时候，

format是定义了\'HH:mm:ss\'，如果把年月日都带上，那界面就不是说只有时分秒了，因为我要的仅仅是时分秒，选择日期不能出现，因为我编辑的工序不可以发生跨天。

所以，在最初拿到数据的时候，就得新加一个字段，保存下来，如：

return workHourService.query(params, $scope.filter).then(function (data) {
                for (var i = 0; i < data.length; i++) {
                    data[i].Date = data[i].StartTime;
                }

                return data;
            });

View Code

然后用Date的日期加上StartTime的时分秒，这样才能得到所要的数据，太坑，搞了整整一天

也请大神指点，有没有更好的方式