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, Aug 21 '15 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, Aug 21 '15 at 10:36
Similar question is already answered in previously http://stackoverflow.com/questions/20131553/angularjs-convert-dates-in-controller — Sabarish, Aug 21 '15 at 10:48
create a plunkr where we can see the exact issue you're facing please. — sirrocco, Aug 21 '15 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, Aug 21 '15 at 12:08

score 1 · Answer 1 · answered Aug 21 '15 at 10:22

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 '15 at 10:22

K K

17,794
4
30
39

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. – skoufandri Aug 21 '15 at 10:32

score 1 · Answer 2 · answered Aug 21 '15 at 10:36

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>

Asqan · Answer 3 · 2015-08-21T10:35:21.227

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 '15 at 10:35

answered Aug 21 '15 at 10:22

Asqan

4,319
11
61
100

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. – skoufandri Aug 21 '15 at 10:35
okay, write the code in the bracket in your controller. it will work if date is given – Asqan Aug 21 '15 at 10:36

niraj rahi · Answer 4 · 2018-04-19T08:50:19.307

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 '18 at 08:50

answered Apr 19 '18 at 08:35

niraj rahi

57
1
5

1

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. – Vishal Chhodwani Apr 19 '18 at 09:04
@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 – niraj rahi Apr 19 '18 at 12:55

AngularJS : format date input

4 Answers4