Angular copy a unix date to an angular/js date

Question

When the user clicks the button I want it to copy the vm.checkin (unix date) to the angular type=date field.

<input type="date" ng-model="vm.receiptForm.paidDate" id="receiptPaidDate">
<button ng-click="vm.receiptForm.paidDate = (vm.checkin * 1000) | date:'yyyy-MM-dd HH:mm:ss Z'">
    <span class="size-tiny">Copy Date</span>
</button>

Is that possible to do? I cant seem to make it work.

Stanislav Kvitash · Accepted Answer · 2017-08-29T12:32:31.273

The model for input[type=date] must always be a Date object, but date filter formats date to a string based on the provided format. You just need to convert your timestamp to a date as described here and then assign it to vm.receiptForm.paidDate.

UPDATE: as an option you can create your custom filter to achieve the desired functionality, see the code snippet below:

var module = angular.module("demo", []);

module.filter('tsToDate', function () {
    return function (timestamp) {
        return new Date(timestamp);
    };
});

module.controller('Demo', [function Demo() {
    var vm = this; 
    vm.checkin = 1529442000000;  
    vm.receiptForm = {
        paidDate: ''
    };
}]);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="demo" ng-controller="Demo as vm">   
    <div>
        <button ng-click="vm.receiptForm.paidDate = (vm.checkin | tsToDate)">Copy Date</button>
    </div>        
    <input type="date" ng-model="vm.receiptForm.paidDate" />    
    <code>
        {{ vm.receiptForm }}
    </code>  
</div>

Ahh so there is no way of doing it inside the html page? You have to do it in the controller? — torbenrudgaard, Aug 29 '17 at 11:43
@torbenrudgaard yes, you can do it in controller. Or you can create a directive with [custom converters](https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#$parsers) that will allow `input[type=date]` to work with unix timestamps, [something like this could work for you](http://jsfiddle.net/8jFpV/773/). — Stanislav Kvitash, Aug 29 '17 at 12:09

Angular copy a unix date to an angular/js date

1 Answers1