Date filter not working - angularjs

Long story short, I'm trying to display a date that came from json.
This is what I tried:
{{ item.CreateDate | date }}
{{ item.CreateDate | date : 'MM/dd/yyyy' }}
This is what I get: /Date(1413010800000)/
I want to get 10/14/2014
What am I doing wrong? Thanks

Try
{{ item.CreateDate | msDate | date : 'MM/dd/yyyy' }}
And the filter
app.filter('msDate', function () {
return function (item) {
return new Date(parseInt(item.substr(6)));
};
});
Thanks #Brocco.

Related

problems with a filter date in angularJS

i have a problems with my filter date , I would like to filter between 2 date but with a condition if the date from is not valid then I start at 2017-01-01 (for that I think it is good) and if the date 'to' is not valid I start Has the current date
Here is my plunker:
http://plnkr.co/edit/8sK29zG7YoPOdntbFfcK?p=preview
Thank you for your help
Your filter could be something like this :
app.filter("myfilter", function($filter) {
return function(items, from, to) {
const testFrom = Date.parse(from);
const testTo = Date.parse(to);
if (!testFrom){
console.log('Not valid');
from = moment('2017-01-01');
}
//here it does nt work
if (!testTo){
to = moment();
}
const valids = items.reduce((acc,val) => {
const date = moment(val.dateenvoi);
if(date.isSameOrAfter(from) && date.isSameOrBefore(to))
acc.push(val)
return acc;
},[]);
return valids;
};
});
Check this
No need for custom filter for this functionality, you can use angular predefined filter for this like
<input type="text" name="S_Date" ng-model="filter.dateenvoi"/>
and
<tr ng-repeat="x in myData | filter: filter">
working Plunker

AngularJs Select menu using ng-repeat, first item should display differently

Below code is fetching today's date and 7 more days e.g. 2016-02-01, 2016-02-02, 2016-02-03, 2016-02-04 etc.
but for today's date I do not want to display a date to user but word "Today" however, I want values in date format as I want to fill it into database while submitting form.
<select ng-model="item1" style=" width:100%; text-align:center;" ng-change="update()">
<option style="text-indent:30%" ng-repeat="item1 in IdeaMonth" value="{{item1.one | date:'yyyy-MM-dd' }}" >
{{item1.one | date:'dd-MM-yyyy' }}
</option>
</select>
You need your custom filter, where you can use moment or the same angular js date filter to get the necessary value:
function compareDateParts(a, b)
{
var aMSec, bMSec;
a = new Date(a);
b = new Date(b);
a.setHours(0,0,0,0);
b.setHours(0,0,0,0);
aMSec = a.getTime();
bMSec = b.getTime();
return aMSec == bMSec ? 0 : (aMSec > bMSec ? 1 : -1);
}
angular.module('app').filter('customDate', ['$filter', function($filter) {
return function(date, format) {
if(compareDateParts(date, new Date()) == 0) return "TODAY"
return $filter('date')(date, format);
};
}]);
Using {{date | customDate: 'dd-MM-yyyy'}}

how to pass a variable to the ternary condition in angularjs?

I tried this:
{{experience.current_work?"Present":{{experience.date_end | date:'MMM yyyy'}}}}
But this is wrong in ternary condition.How do I solve it?
You're already within an expression (ie {{...}}) so you don't need to start a new one
{{experience.current_work ? "Present" : experience.date_end | date:'MMM yyyy'}}
or maybe this if you're worried about order of evaluation
{{experience.current_work ? "Present" : (experience.date_end | date:'MMM yyyy')}}
You can do it like few ways:
Call the function below when you need to check the condition:
$scope.CheckCurrentWork = function() {
if ($scope.experience.current_work) {
//Do as you want "Present"
} else {
//Do as you want
experience.date_end | date: 'MMM yyyy'
}
}
OR
{{experience.current_work ? "Present" : experience.date_end | date:'MMM yyyy'}}
OR
If you want to apply your condition in any directive
<div ng-click="experience.current_work ?'Present' : experience.date_end | date:'MMM yyyy'">

Currency filter in angular breaks for values > 1000, only if rounded

These work as expected:
{{ 999 | currency }}
{{ 999 | number:0 | currency }}
{{ 1000 | currency }}
{{ 50000 | currency }}
These do not print anything:
{{ 1000 | number:0 | currency }}
{{ 50000 | number:0 | currency }}
Any ideas?
You can use custom currency filter. Check this:
app.filter('currencyFilter',
['$filter', '$locale', function(filter, locale) {
var currencyFilter = filter('currency');
var formats = locale.NUMBER_FORMATS;
return function(amount, num, currencySymbol) {
if (num===0) num = -1;
var value = currencyFilter(amount, currencySymbol);
var sep = value.indexOf(formats.DECIMAL_SEP)+1;
var symbol = '';
if (sep<value.indexOf(formats.CURRENCY_SYM)) symbol = ' '+formats.CURRENCY_SYM;
return value.substring(0, sep+num)+symbol;
};
}]);
And use it like the following:
{{1000 | currencyFilter:0}} // $1,000
{{1000.234 | currencyFilter:0}} // $1,000
{{1000.55555 | currencyFilter:2}} // $1,000.56
Check this plunker
The problem is that currency filter expect it's input to be number, but in case of 1000 | number:0 it gets string, that it can't parse as number.
If you use number filter to round the number, then you may create your own filter:
myApp.filter('round', function(val) {
return Math.round(val);
});
And use it as: {{ 1000 | round | currency }}

Ignore Time Zone Angularjs

Is there a better way to ignore an timezone in Angularjs:
"2014-01-18 14:30:00" Instead Of "2014-01-18 15:30:00"
function Scoper($scope) {
$scope.datum = "2014-01-18T14:30:00Z";
}
<div ng:app ng:controller="Scoper">
DateTime <br />
Angular: {{datum | date:'yyyy-MM-dd HH:mm:ss'}} <br />
</div>
http://jsfiddle.net/samibel/2rMXJ/
I was experimenting the same problem for a while. There is a timezone possible parameter to the date filter which I think should be the preferred solution, instead of making your own filter and append it. So, this is what worked for me:
{{ someAcceptedDateFormat | date : 'shortTime' : 'UTC' }}
I found this answer: Why does angular date filter adding 2 to hour?
Here is an example:
Just pipe another filter:
app.filter('utc', function(){
return function(val){
var date = new Date(val);
return new Date(date.getUTCFullYear(),
date.getUTCMonth(),
date.getUTCDate(),
date.getUTCHours(),
date.getUTCMinutes(),
date.getUTCSeconds());
};
});
In your template:
<span>{{ date | utc | date:'yyyy-MM-dd HH:mm:ss' }}</span>
I Have the solution:
app.filter('timezone', function(){
return function (val, offset) {
if (val != null && val.length > 16) {
return val.substring(0, 16)
}
return val;
};
});
template:
<span>{{ date | timezone | date:'yyyy-MM-dd HH:mm:ss' }}</span>
http://jsfiddle.net/samibel/n4CuQ/

Resources