【问题标题】:angular material date picker field value empty角度材料日期选择器字段值空
【发布时间】:2017-03-24 16:30:38
【问题描述】:

我想获取用户的出生日期,预定义的最小和最大日期可以正常工作。 我想要的日期格式是 DD-MM-YYYY,为此我在配置中定义了以下内容;

app.config(['$mdDateLocaleProvider', function ($mdDateLocaleProvider) {
      $mdDateLocaleProvider.formatDate = function(date) {
         return moment(date).format('DD-MM-YYYY');
      }}]);

控制器有

    $scope.user = {};
    $scope.user.dob = new Date();
    $scope.maxDate = new Date(
       $scope.user.dob.getFullYear() - 10,
       $scope.user.dob.getMonth(),
       $scope.user.dob.getDate()
    );
    $scope.minDate = new Date(
       $scope.user.dob.getFullYear() - 120,
       $scope.user.dob.getMonth(),
       $scope.user.dob.getDate()
    );

HTML 是;

<md-datepicker 
 ng-model="user.dob" 
 md-placeholder="Enter date of birth"
 md-min-date="minDate" 
 md-max-date="maxDate">
</md-datepicker>

使用此代码,该字段默认显示当前日期,这是我不想要的,

我希望日期字段默认为空。

我还想通过以下两种方式获取值 1) 日期-月份-年份 和 2) 日-月-年时-分-秒

当我尝试获取该值时,它显示“09-11-2016T18:30:00.000Z”

我想要“09-11-2016”或“09-11-2016 18:30:00”

【问题讨论】:

  • 如果我删除在配置块中编写的代码,那么字段值不会显示任何日期,但这会阻止我设置特定的日期格式。

标签: angularjs datepicker material-design


【解决方案1】:

您的 mdDateLocaleProvider 不检查空值。

你的问题是:

app.config(['$mdDateLocaleProvider', function ($mdDateLocaleProvider) {
  $mdDateLocaleProvider.formatDate = function(date) {
     return moment(date).format('DD-MM-YYYY');
  }}]);

它需要是这样的:

$mdDateLocaleProvider.formatDate = function(date) {
   var m = moment(date);
   return m.isValid()? m.format('DD-MM-YYYY') : '';
};

然后就可以设置了

$scope.user.dob=null;

然后得到一个空的 Datepicker。

【讨论】:

    【解决方案2】:

    问题在于您的 ng 模型。您正在使用当前日期对其进行初始化:

    $scope.user.dob = new Date();
    

    只需清空这个变量就可以了;)

    【讨论】:

    • 我试过 $scope.user.dob = "";和 $scope.user.dob = null;但两者都导致“无效日期”和 $scope.user.dob = undefined;显示当前日期
    猜你喜欢
    • 2018-09-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多