AngularJS : format date input

Question

i have an input type Date in my HTML.(i'm working with angularjs )
i used it like this :

< input ng-model="voyage.dateRetour" type="date">   
{{voyage.dateRetour}}

i created a pdf with jsPDF and i use the inputs form the complete the pdf so i did :

     $scope.createPDFs= function (filename) { 
     var doc = new jsPDF();
  doc.text(13, 95, 'Retour : '+$scope.voyage.dateRetour );

and it gives me : Fri Aug 21 2015 00:00:00 GMT+0200 (Paris, Madrid (heure d’été))

i dont know how to change the format to short format like DD-MM-YYYY .

i tried to do a filter like :

$filter('date')($scope.voyage.dateRetour, "dd/MM/yyyy");

Thank you for helping.

try replacing {{voyage.dateRetour}} with {{voyage.dateRetour | date:"dd/MM/yyyy"}} — Sabarish
– Sabarish, Commented Aug 21, 2015 at 10:22
thank you for responding, i need the date in my controller for use it in pdf with jsPDF , so i need a filter in my controller not in HTML. — skoufandri
– skoufandri, Commented Aug 21, 2015 at 10:36
Similar question is already answered in previously stackoverflow.com/questions/20131553/… — Sabarish
– Sabarish, Commented Aug 21, 2015 at 10:48
create a plunkr where we can see the exact issue you're facing please. — sirrocco
– sirrocco, Commented Aug 21, 2015 at 11:04
i can't create plunker because i need the plugin of jsPDF but i can explain : i created a pdf with jsPDF and i use the inputs form the complete the pdf so i did $scope.createPDFs= function (filename) { var doc = new jsPDF(); doc.text(13, 95, 'Retour : ' + $scope.voyage.dateRetour ); and it gives me Fri Aug 21 2015 00:00:00 GMT+0200 (Paris, Madrid (heure d’été)) — skoufandri
– skoufandri, Commented Aug 21, 2015 at 12:08

K K · Accepted Answer · 2015-08-21 10:22:42Z

1

Try this:

    <div ng-app ng-controller="MyCtrl">{{date | date:'dd MMM yyyy - hh:mm a'}}
    <br />{{date}}</div>

i.e using the filter in the html itself.

Demo: http://jsfiddle.net/Blackhole/srnug/

answered Aug 21, 2015 at 10:22

K K

18.2k4 gold badges33 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

skoufandri Over a year ago

sorry i think i didn't ask wwell my question , for the html i just tested it , i need the date in my controller for use it in pdf with jsPDF , so i need a filter in my controller not in HTML.

Shekhar Khairnar · Accepted Answer · 2015-08-21 10:36:21Z

1

Checkout this it will help you:--

function MyController($scope){
  $scope.MyObje = {mydate:new Date()}
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>

<div ng-app ng-controller="MyController">
  <input type="date" ng-model="MyObje.mydate">

  {{MyObje.mydate | date:'dd/MM/yyyy'}}
</div>

answered Aug 21, 2015 at 10:36

Shekhar Khairnar

2,7013 gold badges29 silver badges46 bronze badges

Comments

Asqan · Accepted Answer · 2015-08-21 10:35:21Z

0

First split for date and time. Second to replace all "-" to "/"

< input ng-model="voyage.dateRetour" type="date">   
{{voyage.dateRetour.split("T")[0].split("-").join("/");}}

edited Aug 21, 2015 at 10:35

answered Aug 21, 2015 at 10:22

Asqan

4,51912 gold badges63 silver badges103 bronze badges

2 Comments

skoufandri Over a year ago

Thanks you but it doesn't work for me like i said in a comment i need the date in my controller for use it in pdf with jsPDF , so i need a filter in my controller not in HTML.

Asqan Over a year ago

okay, write the code in the bracket in your controller. it will work if date is given

Niraj Rahi · Accepted Answer · 2018-04-19 08:50:19Z

0

/* code to format date into controller */

 app.controller('homeController', function($scope,$filter) {
    $scope.date = $filter("date")(new Date('2017-12-04'),'dd/MM/yyyy');
    alert($scope.date);
 }

edited Apr 19, 2018 at 8:50

answered Apr 19, 2018 at 8:35

Niraj Rahi

571 silver badge5 bronze badges

2 Comments

Vishal Chhodwani Over a year ago

While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.

Niraj Rahi Over a year ago

@VishalChhodwani this is just a sample u can modify as per your requirement. U can call it inside a function or use in html. In short you can modify this code as your need

Collectives™ on Stack Overflow

AngularJS : format date input

4 Answers 4

1 Comment

Comments

2 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related