1

How to dynamically bind input field of date type with maximum date value in AngularJS? There are no ng-max, ng-min directives provided by AngularJS.

2
  • I want to set max date value 18 years less than current date on form loading event. Current date is fetched from server. Then max date is calculate in the controller. But I cannot bind max date value to the input element. Any suggestions are appreciated. Commented Feb 10, 2017 at 14:09
  • Please check my answer. Does it work for you? Commented Feb 24, 2017 at 9:24

1 Answer 1

3

Check out this fiddle. Just bind your $scope vars directly into the tag attributes. I used moment.js for date handling.

View

<div ng-controller="MyCtrl">
  <input type="date" min="{{ min }}" max="{{ max }}" />
</div>

AngularJS App

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl', function ($scope) {

    //init dates
    var minDate = new moment();
    var maxDate = new moment().add(18, 'years'); 

    $scope.min = minDate.format("YYYY-MM-DD");
    $scope.max = maxDate.format("YYYY-MM-DD");
});
Sign up to request clarification or add additional context in comments.

4 Comments

liked it, is it possible only with angular?
@SaurabhAgrawal Sorry, what? I dont understand you.
without using moment.js how can I do it, if I want it only with angular?
@SaurabhAgrawal You can use date. w3schools.com/jsref/jsref_obj_date.asp

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.