Is there any directive in Angular, I want to enable user when he write 2/3/67 in input for date date needs to be formatted like 02/03/1967 I tried few things on my own but they didn't work.
Just add a Angularjs formating, when displaying users input like so
{{yourdate.variable | date:'yyyy-MM-dd'}}
Se more at AnguarJS date function
EDIT
Here is working Plunker, with different type of dates. Enjoy
Related
Any help on formatting /date()/ in angularjs 1.6.
Want to format it in HTML not inside the javascript controller.
Have tried angular-relative-date.
Got it working using this code
{{order.CreatedOn.replace('/Date(','').replace(')/','') | date | relativeDate}}
Consider the following setup: I have a form with a angular-bootstrap datepicker (uib-datepicker-directive), which I want to serve with different languages, such that dates are shown in different formats.
I am changing the locale dynamically with the angular-dynamic-locale-module, by using information from the state parameters.
A date object is printed with correct language-specific format using the angular date filter: {{vm.date | date:'fullDate'}}
Unfortunately the formatting for the datepicker is not working immediately. When loading the page and call a set-locale function it needs a click into the datepicker to adjust the format of the month and click to the month and back to additionally adjust the translations for the weekdays.
I have created a plunkr to demonstrate the behaviour.
http://plnkr.co/edit/2HA8LI5SzUqx2jSmUdjn?p=preview
Does anyone know this behaviour? And if so, is there a way to fix this, preferably without messing up the datepicker directive?
Thanx in advance, micoud
I want to get this format In USD : 1.123.362,32 and this format in euro :1,122,363.33
I used AngularJS Filter "currency" who Format a number to a currency format but without separtors like "," "."
Use a Filter
here is a link to the docs where you can see an example.
You need to use the currency filter to get the desired effect. It should look like this
HTML
{{ currency_expression | currency : symbol : fractionSize}}
JS
$filter('currency')(amount, symbol, fractionSize)
To do this with the correct , or . you need to have the correct currency format selected.
Math.round()
inside your controller when you are setting the scope make sure you do Math.round() so the number you return is always whole.
Example
Math.round(2.5);
Alternatively
If the currency filter does not meet your requirements you can always use the number format that Angular provides, Doc are here
HTML
{{ number_expression | number : fractionSize}}
JS
$filter('number')(number, fractionSize)
If All Else Fails
Create your own custom filter here is a tutorial on how to build your own custom filter in angular, since your requirements are a little strange you should consider building your own filter to match them. This way you can set your , or . and anything that precedes or follows your number.
Its definitely more difficult than using the built in functionality but since you cant get it to match up with either of the methods above I would take this route.
currency angularjs's filter does not deal comma in usd and point in euro.... I used kendo ui like the filter in grid,it deal all event :
kendo.toString(236, 'c', fr-FR);
hope we find a complete solution with angularjs.
Please accept my apologies if i had any mistakes in my post. This is my first post here. But, i am not new to StackOverflow. Correct me if any.
I am using angular-bootstrap-datetimepicker library from the below url:
Link to library
I am currently embedding the calender on the page.
I am using angular.js, moment.js, grunt and bower. Absolutely no issue loading the calender and can even select a date and display the selected date as well.
Here is the sample code:
<div>
Selected Date: {{ data.embeddedDate | date:'yyyy-MMM-dd' }}
<datetimepicker data-ng-model="data.embeddedDate" data-datetimepicker-config="{ startView:'day', minView:'day'}" />
</div>
I am trying to highlight today's date automatically when the datetimepicker shows on the page.
As you can see, in the config options, i could set the default view and min view.
Note: I tried to mimic the working code (till now) in Plunkr but, its not showing the calendar. I added all libraries as well. Anyways, that's just for idea only. If i could get the Plunkr working, i will update again.
Here is the link to Plunkr.
Any suggestions (regarding highlight today date by default) will be appreciated.
To get the directive to show todays date by default, you can set the value of data.embeddedDate in the controller through its scope, like so:
$scope.data = { embeddedDate: new Date() };
Working Plunkr
date input is not showing the date until the user change it
// showing the date
<p>{{someDate | date}}</p>
// not showing the date. instead showing mm/dd/yyyy.
// but value will change when use change is
<input type="date" ng-model="someDate">
example code in jsbin
it IS working on version 1.3.0-beta.3, but
I need it to work on stable version 1.2.14.
is it possible?
I've created a simple directive to enable standard input[type="date"] form elements to work correctly with AngularJS ~1.2.16.
Please look here for details:
https://github.com/betsol/angular-input-date
And here's the demo:
http://jsfiddle.net/F2LcY/2/
Hope it helps!
I think the answer is you must upgrade to angularjs 1.3 or newer. Details in angular.js/pull/5864. The commit implementing this is pretty large to try to backport to 1.2 IMHO.
Try converting the someDate scope variable from string to Date format and then if you use input type="date" ng-model="someDate" . This solved my problem .