bootstrap-ui-datetime-picker未显示在输入字段的预选日期中

时间:2018-09-25 11:08:54

标签: angularjs momentjs bootstrap-datetimepicker bootstrap-ui

在我的应用程序中,我使用bootstrap-ui-datetime-picker。 我有两种情况,第一种是我第一次来并进行新的日期选择。在日期输入字段和日历中,我选择了今天的日期,这是正确的并且可以。

在第二种情况下,当我从API日期数据获取时,输入字段为空,但是在日历中,我看到了正确的选定日期。

问题是,我需要在输入字段和日历弹出窗口中获得一个选定的日期,就像在第一种情况下一样。

这是我的代码...

<input type="text" ng-disabled="true" readonly="true" class="form-control" datetime-picker="MMM d, y" ng-model="ctrl.picker4.date"
                                            is-open="ctrl.picker4.open" enable-time="false" button-bar="ctrl.buttonBar" datepicker-options="ctrl.picker4.datepickerOptions"
                                        />

这是格式化我如何从API获取日期并将其设置为ng-model的格式。 从API中,我得到了这样的格式(字符串)

 data.from:"2018-09-24"

使用momentjs,我格式化日期并将其设置为ng-model

$scope.ctrl.picker4.date = moment(data.from).format("YYYY-MM-DD");

1 个答案:

答案 0 :(得分:0)

问题出在日期格式上。我用过滤器解决了

.directive('dateFormatter', [
 function () {
  return {
      restrict: 'A',
      require: 'ngModel',
      link: function postLink(scope, element, attrs, ngModel) {
        ngModel.$parsers.push(function(data) {
          return moment(data).format('YYYY-MM-DD');
        });

        ngModel.$formatters.push(function(data) {
          return moment(data, 'YYYY-MM-DD').toDate()
        });
      }
  };

} ]);