javascript - Invalid "ng-model" value with Bootstrap UI datepicker -
i'm trying implement simple datepicker directive in angularjs application. following ui bootstrap documentation error every time:
datepicker directive: "ng-model" value must date object, number of milliseconds since 01.01.1970 or string representing rfc2822 or iso 8601 date.
i have found few other related issues here , here, neither of them helpful.
i tried accessing $parent , $parent.$parent suggested here, rid of error, doesn't update model.
here plunker recreating problem:
http://plnkr.co/edit/caugqznh77sbknmgtfil?p=preview
<!doctype html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script> <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.js"></script> </head> <body ng-app="myapp" ng-controller="appcontrol appctrl"> <label>{{dt | date:'fulldate'}}</label> <input type="text" class="form-control" datepicker-popup="mmmm d, yyyy 'at' h:mm a" ng-model="dt" is-open="opened" datepicker-options="dateoptions" ng-required="true" close-text="close" /> <span class="input-group-btn"> <button type="button" class="btn btn-default" ng-click="open($event)">pick</button> </span> <script> angular.module("myapp", ['ui.bootstrap']).controller("appcontrol", ["$scope", function($scope) { $scope.opened = false; $scope.dateoptions = {}; $scope.dt = new date(); $scope.open = function($event) { $event.preventdefault(); $event.stoppropagation(); $scope.opened = true; }; }]); </script> </body> </html>
any appreciated.
the problem format providing in attribute 'datepicker-popup'.
use value of attribute 'longdate' follows :
datepicker-popup="longdate"
use follows :
<input type="text" class="form-control" datepicker-popup="fulldate" ng-model="dt" is-open="opened" datepicker-options="dateoptions" ng-required="true" close-text="close" />
i updated plnkr.
Comments
Post a Comment