日付ピッカー形式はngモデルに影響しません角度材質

Question

この形式['DD-MM-YYYY']は、ng-modelのDatePicker形式です。

私は

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

に

）（設定でこれを行なったし、それがビューとログ内の有効な日付形式を返します。

が、NG-モデルの値はJSでこの変数を記録する場合とき、それは私にこの日付フォーマットを与える

Mon May 30 2016 00:00:00 GMT+0200 (EET) 

Answer 1

ので、これは

<md-datepicker ng-model="user.bod" md-placeholder="Enter birth date "> </md-datepicker> 

変数ngのモデルに影響を与えませんDateオブジェクト。モデル値の文字列化にサービスを使用する：

var dateString = $mdDateLocale.formatDate(valueFromNgModel); 

Answer 2

あなたはGO！

https://stackoverflow.com/a/43392704/5613548

angular.module('MyApp') 
 

 
.controller('AppCtrl', function($scope) { 
 
    $scope.person = { 
 
    name: "John", 
 
    birthDate: "1990-01-01 00:00:00" 
 
    }; 
 
}) 
 

 
.directive('mdDatepicker', function() { 
 
    function link(scope, element, attrs, ngModel) { 
 
    var parser = function (val) { 
 
     val = moment(val).format('YYYY-MM-DD hh:mm:ss'); 
 
     return val; 
 
    }; 
 
    var formatter = function (val) { 
 
     if (!val) return val; 
 
     val = moment(val).toDate(); 
 
     return val; 
 
    }; 
 
    ngModel.$parsers.push(parser); 
 
    ngModel.$formatters.push(formatter); 
 
    } 
 
    return { 
 
    require: 'ngModel', 
 
    link: link, 
 
    restrict: 'EA', 
 
    priority: 1 
 
    } 
 
});

<link href="https://material.angularjs.org/HEAD/docs.css" rel="stylesheet"/> 
 
<link href="https://material.angularjs.org/HEAD/angular-material.css" rel="stylesheet"/> 
 

 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-messages.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-route.min.js"></script> 
 
<script src="https://material.angularjs.org/HEAD/angular-material.js"></script> 
 
<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/assets-cache.js"></script> 
 

 

 

 
<div ng-app="MyApp" ng-controller="AppCtrl"> 
 
    <md-content> 
 
    <md-datepicker ng-model="person.birthDate" md-placeholder="Enter date"></md-datepicker> 
 
    </md-content> 
 
    
 
    <big>ng-model value is: <strong>{{person.birthDate}}</strong></big> 
 
</div>