I'm not able to restrict max and min date in angular-datepicker angular-datepicker link
<div date-picker="start" min-date="Date string | Expression" max-
date="Date string | Expression"></div>
What will be valid expression to achieve it?
Below is the list of expression I tried.
min-date="2018-03-12 | date : 'yyyy-MM-dd'"
min-date="2018-03-12 | 'yyyy-MM-dd'"
min-date="2018-03-12 | date"
You need to use the angular controller for the specific scenario.
//HTML code
<div date-picker="start" min-date="minDate" max-
date="maxDate"></div>
//Controller code
$scope.minDate = new Date();
$scope.maxDate = new Date(); //as per your expectation
Related
Getting below warning and I don't see the format being displayed in input.
The specified value "{{start_time | date:'HH:mm'}}" does not conform
to the required format. The format is "HH:mm", "HH:mm:ss" or
"HH:mm:ss.SSS" where HH is 00-23, mm is 00-59, ss is 00-59, and SSS is
000-999.
<input type="time" value="{{start_time | date:'HH:mm'}}">
Current output
Expected hh:mm
Looks like you have your date in start_date and are trying to use start_time on the front-end. This should work:
<input type="time" ng-value="start_date | date : 'HH:mm'">
Example: Working Plunker
UPDATE: to allow for updating the model, you should add a filter:
.filter('parseDate', function () {
return function (date) {
if (angular.isDate(date)) return date;
return new Date(Date.parse(date.replace(/:\d{2}[.,]\d{3}Z$/, '')));
};
});
var start_time = "2017-08-29T17:15:16.814Z";
$scope.start_date = $filter('parseDate')(start_time);
Example: Working Plunker
<div ng-repeat="n in ShoeDetails.txnList">
<div ng-if="n.statusNo == 21">
<p ng-bind="n.timeStamp | date:'MM/dd/yyyy'"></p>
</div>
</div>
i'm trying to update the date format using angularjs,but i'm getting a result like this /Date(1459418939990+0530)/,unable to understand what was this,any help appreciated
Those are ticks. You need to parse and convert it to a date object.
Either do the below in the frontend using javascript, or do it in C#.
var myDate = "/Date(1459418939990+0530)/";
var regex = /-?\d+/;
var match = regex.exec(myDate);
var date = new Date(parseInt(match[0]));
I am getting date in loop from database. The format is like "2015-09-21 18:30:00". But I want to change it as 'dd/MM/yyyy'.
I tried like this
{{obj.added_date | date : 'dd/MM/yyyy'}}
It shows like
2015-09-21 18:30:00 | date : 'dd/MM/yyyy'}}
If I use fulldate is shows me like:
2015-09-21 18:30:00 | date : 'fullDate'}}
for shortDate it shows like this:
2015-09-21 18:30:00 | date : 'shortDate'}}
The date your passing to view is actually a string and hence angular date filter does not recognise it as date object. You need to convert it to date object first.
Also be careful with firefox, it doesn't work for new Date(); if date separator in '-' instead '/'. So I would also suggest below
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl', ['$scope','$filter', function ($scope,$filter) {
var dateStr = '2015-09-21 18:30:00';
$scope.dt = $filter('date')(new Date(dateStr.split('-').join('/')), "d/M/yyyy 'at' h:mm a");
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<bod ng-app="myApp">
<div ng-controller="MyCtrl">
<div>{{dt}}</div>
</div>
</body>
EDIT: I have created a filter which will work for converting string to date object and will work in loop too
var myApp = angular.module('myApp',[]);
myApp.controller("MyCtrl", function ($scope) {
$scope.dt = '2015-09-21 18:30:00';
});
myApp.filter('formatDate', function(dateFilter) {
var formattedDate = '';
return function(dt) {
console.log(new Date(dt.split('-').join('/')));
formattedDate = dateFilter(new Date(dt.split('-').join('/')), 'd/M/yyyy');
return formattedDate;
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<bod ng-app="myApp">
<div ng-controller="MyCtrl">
<div>{{dt | formatDate: dt:'d/M/yyyy'}}</div>
</div>
</body>
Hope this helps
The date format that you have specified doesn't match the input specifications provided in the AngularJS documentation. The following is taken from https://docs.angularjs.org/api/ng/filter/date
Date to format either as Date object, milliseconds (string or number) or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss.sssZ and its shorter versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd or yyyyMMddTHHmmssZ). If no timezone is specified in the string input, the time is considered to be in the local timezone.
I would suggest that you convert the date value into milliseconds and then pass it into the filter.
What i have done is before bindind the data in angular JS you can format the data
//Here i am taking the DOB from session and converted the format in dd-MM-yyyy format
string DOB = ((ABC.Models.Student)Session["Student"]).DOB.ToString("dd-MM-yyyy");
//Here i have used a hidden field where i am going to store DOB in ng-Init
<input type="hidden" name="DOB" id="DOB" ng_init = "DOB=' " + "Date of Birth: " + DOB + "'" /><br />
Later can call your ng-bind method for displaying.
<p ng-bind="DOB"></p>
I am using datetimepicker.js.
I have the following code:
Partial HTML:
<div ng-hide="editingData[x.date]">{{x.date|date}} </div>
So my date is coming as:
May 21, 2015 2:52:29 PM
Expected:
May 21, 2015 2:52:29 PM IST
So Is there any easy way to add timezone in angularjs ?
I am having moment.js included as well and found that it can manipulate dates well. Can it be helpful ?
Displaying local time zone
may be this will help you :)
<div ng-app ng-controller="MyCtrl">
{{date | date:'MMM dd yyyy - h:mm:ss a '}} {{z}}
</div>
function MyCtrl($scope) {
$scope.date = new Date();
var now = new Date().toString();
$scope.z = now.indexOf('(') > -1 ?
now.match(/\([^\)]+\)/)[0].match(/[A-Z]/g).join('') :
now.match(/[A-Z]{3,4}/)[0];
if ($scope.z == "GMT" && /(GMT\W*\d{4})/.test(now)) {
$scope.z = RegExp.$1;}
}
Working js fiddle
I've got a date coming in from an API that returns the date like this: 2012-10-12 00:00:00
I'm printing it to my page like this:
<span class="year" ng-bind-html="hit._highlightResult.original_release_date.value"></span>
with original_release_date.value being that date (2012-10-12 00:00:00). Does anyone know a quick and easy way to just return the year?
Any help is appreciated. Thanks in advance!
you can use the date api in angularjs
<span class="year"> {{ hit._highlightResult.original_release_date.value | date:"yyyy" }} </span>
hit._highlightResult.original_release_date.value should be a (according to doc)
Date to format either as Date object, milliseconds (string or number) or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss.sssZ and its shorter versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd or yyyyMMddTHHmmssZ). If no timezone is specified in the string input, the time is considered to be in the local timezone.
so create javascript date object and format it to show only the year,
step 1 - create a filter to get a date object from a string (2012-10-12 00:00:00)
app.filter('dateToISO', function() {
return function(input) {
var dateTime = input.split(" ");
var date = dateTime[0];
var datePartials = date.split("-");
var time = dateTime[1];
var timePartials = time.split(":");
var formattedDate = new Date();
formattedDate.setFullYear(datePartials[0]);
formattedDate.setMonth(datePartials[1]-1);
formattedDate.setDate(datePartials[2]);
formattedDate.setHours(timePartials[0]);
formattedDate.setMinutes(timePartials[1]);
return formattedDate;
};
});
step 2 - create a controller function to get the date object
$scope.getDate = function() {
return $filter('dateToISO')('2012-10-12 00:00:00');
};
step 3 - call that function and get the date object to format in the HTML
<span class="year"> {{ getDate() | date:"yyyy" }} </span>
here is the working Demo Plunker
This may be a bit off and cheating but I think '2012-10-12 00:00:00'.split('-')[0] will do the trick