在angularjs中添加jquery日期选择器

Question

我正在尝试在angularjs中显示jquery日期选择器，但收到的错误为element.datepicker is not a function。

<form ng-app="myApp" ng-controller="myCtrl">
        <div>
            <label>Date<span class="requiredField">*</span></label>
            <input type="text" id="levFrom" datepicker ng-model="leave.from_date"  required>
        </div>
</form>
<script>
    var app = angular
                    .module("myApp", [])
                    .directive("datepicker", function () {

                        function link(scope, element, attrs) {
                            element.datepicker({
                                dateFormat: "dd/mm/yy"
                            });
                        }
                        return {
                            require: 'ngModel',
                            link: link
                        };
                    })
                    .controller("myCtrl", function ($scope, $http, $timeout) {
                    })
</script>

我的代码中有什么问题？

plunker：https://plnkr.co/edit/n0sb4CVoSqb0TfRblOLX?p=preview

Answer 1

//Try this one directive
app.directive("datepicker", function () {
return {
restrict: "A",
require: "ngModel",
link: function (scope, elem, attrs, ngModelCtrl) {
  var updateModel = function (dateText) {
    scope.$apply(function () {
      ngModelCtrl.$setViewValue(dateText);
    });
  };
  var options = {
    dateFormat: "dd/mm/yy",
    onSelect: function (dateText) {
      updateModel(dateText);
    }
  };
    elem.datepicker(options);
  }
 }
});