获取没有时间/时区的ui.bootstrap.datepicker值

Question

我需要能够将所选日期值作为日期存储在我的ng-model中。

以下是我的观点：

<script type="text/ng-template" id="form_field_datetime">
  <h3 style="color:coral ;">{{field.displayName}}</h3>
  <br />
  <div>
    <div ng-controller="dateCtrl">
        <p class="input-group">
          <input type="text" class="form-control" datepicker-popup="{{format}}" is-open="opened" ng-required="true" ng-model="field.theValues[0]" />
          <span class="input-group-btn">
            <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
          </span>

        </p>
    </div>  
  </div>
</script>

在选择上面显示的日期时，我的ng-model中存储的值是：

2012-03-12T22:00:00.000Z

我需要：

2012-03-13

这是控制器（几乎与example中一样）：

  app.controller('dateCtrl', ['$scope', 
      function ($scope) {
        $scope.open = function($event) {
          $event.preventDefault();
          $event.stopPropagation();

          $scope.opened = true;
        };

        $scope.dateOptions = {
          formatYear: 'yy',
          startingDay: 0
        };

        $scope.formats = ['yyyy-MM-dd', 'dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
        $scope.format = $scope.formats[0];

      }
  ]);

如何解决这个问题？

Answer 1

我已经在我的问题评论中使用了前面提到的指令来处理所选日期并删除时间信息。

<script type="text/ng-template" id="form_field_date">
  <h3 style="color:coral ;">{{field.displayName}}</h3>
  <br />
  <div>
    <div ng-controller="dateCtrl">
        <p class="input-group">
          <input datepicker-localdate type="text" class="form-control" datepicker-popup="{{format}}" is-open="opened" ng-required="true" ng-model="field.theValues[0]" />
          <span class="input-group-btn">
            <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
          </span>

        </p>
    </div>  
  </div>
</script>

控制器（dateCtrl）：

   app.controller('dateCtrl', ['$scope', 
      function ($scope) {
        $scope.open = function($event) {
          $event.preventDefault();
          $event.stopPropagation();

          $scope.opened = true;
        };

        $scope.dateOptions = {
          formatYear: 'yy',
          startingDay: 0
        };

        $scope.formats = ['yyyy-MM-dd', 'dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
        $scope.format = $scope.formats[0];

      }
  ]);

指令（datepicker-localdate）：

app.directive('datepickerLocaldate', ['$parse', function ($parse) {
    var directive = {
        restrict: 'A',
        require: ['ngModel'],
        link: link
    };
    return directive;

    function link(scope, element, attr, ctrls) {
        var ngModelController = ctrls[0];

        // called with a JavaScript Date object when picked from the datepicker
        ngModelController.$parsers.push(function (viewValue) {
            console.log(viewValue);console.log(viewValue);console.log(viewValue);
            // undo the timezone adjustment we did during the formatting
            viewValue.setMinutes(viewValue.getMinutes() - viewValue.getTimezoneOffset());
            // we just want a local date in ISO format
            return viewValue.toISOString().substring(0, 10);
        });
    }
}]);

现在一切正常！