javascript - 无法在 Angular js 中绑定(bind)日历值

Question

我是 Angular js 新手，尝试从 jquery 日历选择器绑定(bind)日历日期的值，但它不接受所有其他字段绑定(bind)的日期。

这是我的 HTML

<input id="company" name="company"  ng-model="user.company"  type="text" placeholder="" class="form-control" required>

<input type="text"  name="exdate" ng-model="user.exdate"  id="exiprydate" placeholder="DD-MM-YYYY" class="form-control" required>

这是我的 jquery 代码

$(function () {
               $("#exiprydate").datepicker({                        
                      dateFormat: 'dd-mm-yy'
                    });
                });

这是我的 Controller :

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

app.controller('adminController', function($scope, $http, $location) {

    $scope.submitloginform = function(isValid, user) {
        console.log($scope.user);
    });

这是日历快照，我可以通过它选择日期: enter image description here

Answer 1

只需为日期选择器创建一个指令..如下所示:

angular.module('myApp').directive('datePicker', function() {
  return {
   restrict: 'A',
   require: 'ngModel',
   scope: {
        ngModel: '='
   },
   link: function(scope, element, attrs, ngModelCtrl) {
        element.datepicker({
            onSelect: function(date) {
                ngModelCtrl.$setViewValue(date);
            }
        });
   }
  };
});

您的 HTML 将为:

<input date-picker type="text" ng-model="myDate" />