How to change input date format?

Question

JS:

$scope.getDate = new Date();

HTML:

<div class="col-sm-4">
   <input type="date" ng-model="getDate" class="form-control input-sm">
</div>

Result : 10/19/2015 (in Chrome)

It's easy to not use ng-model. {{getDate | date:'yyyy-MM-dd'}}. But I need 'yyyy-MM-dd' format in ng-model, not using date filter. How can I solve this problem?

http://stackoverflow.com/questions/22392328/how-to-format-date-in-angularjs — Nagaraj S, Oct 19 '15 at 09:31

score 1 · Answer 1 · answered Oct 19 '15 at 10:04

1

You can try such way:

Date.prototype.myformat = function() {
        var yyyy = this.getFullYear().toString();
        var mm = (this.getMonth()+1).toString(); // getMonth() is zero-based
        var dd  = this.getDate().toString();
        return yyyy + "-" + (mm[1]?mm:"0"+mm[0]) + "-" + (dd[1]?dd:"0"+dd[0]); // padding
      };
var dd = new Date();
$scope.getDate = dd.myformat;

result: 2015-10-19

answered Oct 19 '15 at 10:04

alexy.semko

11
2

Thank you mate, thank you! I solved the problem with angular UI :D – Oj G Oct 19 '15 at 10:09
There is no need to call *toString*, particularly as the month and day expressions convert the parameters back to a number again during evaluation. Then `mm[1]?mm:"0"+mm[0]` can be `mm > 9?mm:"0"+mm`, same for day. Or `('0'+mm).slice(-2)`. – RobG Oct 19 '15 at 11:40

score 0 · Answer 2 · answered Oct 19 '15 at 10:14

JS :$scope.open = function($event) { $scope.status.opened = true; }; $scope.dateOptions = { formatYear: 'yy', startingDay: 1 }; $scope.format = 'yyyy-MM-dd'; var app = angular.module('someApp',['ui.bootstrap']); //app.js

HTML : <input type="text" class="form-control sm" ng-click="open($event)" datepicker-mode="month" datepicker-popup="{{format}}" ng-model="getDate" is-open="status.opened" datepicker-options="dateOptions" ng-required="true" current-text="Today" clear-text="Clear" close-text="Close"/>

Thanks for your comments guys! ^^

score 0 · Answer 3 · edited Oct 19 '15 at 12:49

0

Use ng-bind for binding model to other HTML element with or without filter.

<p ng-bind=" getDate | date:'yyyy-MM-dd'"></p>

edited Oct 19 '15 at 12:49

Sarjan Desai

3,683
2
19
32

answered Oct 19 '15 at 10:25

Krupesh Kotecha

2,396
3
21
40

How to change input date format?

3 Answers3