1

我在我的 html 页面中使用 datepicker,如下所示:

HTML

  <div ng-controller="StartDateCtrl">
    <label class="control-label" for="startDate">  Date:</label>   
    <div class="row">
        <div class="col-md-6">
            <p class="input-group">
              <input type="text"  name="startDate" class="form-control" show-button-bar="true" datepicker-popup="yyyy-MM-dd" ng-model="startDate" is-open="opened" min="minDate" max="'22-06-2015'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
              <span class="input-group-btn">
                <button class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
              </span>
            </p>
        </div>
    </div>
    </div> 

日期选择器控制器

var StartDateCtrl= function ($scope) {
  $scope.today = function() {
    $scope.travelStartDate = new Date();
  };
  $scope.today();

  $scope.showWeeks = true;
  $scope.toggleWeeks = function () {
    $scope.showWeeks = ! $scope.showWeeks;
  };

  $scope.clear = function () {
    $scope.travelStartDate = null;
  };

  // Disable weekend selection
  $scope.disabled = function(date, mode) {
    return ( mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ) );
  };

  $scope.toggleMin = function() {
    $scope.minDate = ( $scope.minDate ) ? null : new Date();
  };
  $scope.toggleMin();

  $scope.open = function($event) {
    $event.preventDefault();
    $event.stopPropagation();

    $scope.opened = true;
  };

  $scope.dateOptions = {
    'year-format': "'yy'",
    'starting-day': 1
  };

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

主控制器

app.controller('UpdateShoppingBasketCtrl', ['$scope', 'ShoppingBasketFactory', '$location',
                                  function ($scope, ShoppingBasketFactory, $location) {


        alert('START DATE = '+ $scope.startDate );
}]);

提交网页后,我在主表单控制器中检索日期,但格式与日期选择器弹出窗口中显示的格式不同。选择后显示的格式例如是“26/03/2014”。但是,在我的控制器中,我得到:Thu Mar 26 2014 00:00:00 GMT 0000(GMT 标准时间)

请问,如何在控制器中获取显示的日期格式,而不是“Thu Mar 26 2014 00:00:00 GMT 0000(GMT 标准时间)”????

4

3 回答 3

12

您可以使用日期过滤器来格式化日期。这是演示

<body ng-app="MyApp" ng-controller="MyController">
   <div>{{date}}</div>
</body>

脚本

angular.module('MyApp',[])
       .controller('MyController',function($scope,$filter){
    $scope.date = $filter('date')(Date.now(),'yyyy-MM-dd'); 
});
于 2014-03-26T12:10:41.193 回答
4

虽然已经回答了这个问题,但我将提供一个替代方案以及更多细节。

该问题实际上是Angular 1.3.0 rc0 及更高版本中发生的错误。除了使用之外,另一个解决方案$filter是定义一个自定义指令,如下DaveWM所述:

directive('datepickerPopup', function (){
  return {
    restrict: 'EAC',
    require: 'ngModel',
    link: function(scope, element, attr, controller) {
      //remove the default formatter from the input directive to prevent conflict
      controller.$formatters.shift();
    }
  }
})

这应该与使用$filter.

于 2015-01-07T20:53:53.517 回答
4

您只需简单地以角度过滤器方法获取模型值并提供所需的日期格式。$filter它还需要在控制器中定义一件事。

var dateValue =$filter('date')($scope.date, 'MM/dd/yyyy'),
于 2014-07-01T03:52:11.540 回答