为什么jquery Ui日期选择器没有以角度显示?

时间:2017-06-21 20:41:51

标签: javascript jquery angularjs angularjs-directive

我正在尝试使用此链接以角度显示jquery ui日期选择器 https://jqueryui.com/datepicker/ 我喜欢那个

function datePickerDirective() {

  var directive = {
    restrict: 'E',
    scope: {
      date: '=',
      placeHolder: '@',
      isRequired: '=',
      name: '@'
    },
    template: '<input ng-model="date" placeholder="{{placeHolder}}" type="text" />',
    link: function($scope, iElem, iAttr) {

      $(iElem).datepicker({
        maxDate: "+3m +2w",
        minDate: new Date(),
        onSelect: function(date) {
          $scope.$apply(function() {
            $scope.date = date;
          });
        }
      });
    }
  };

  return directive;
}

但它没有显示datepicker

这是我的代码 https://plnkr.co/edit/kW6eGmuPFxFvzZfKGZXv?p=preview

2 个答案:

答案 0 :(得分:0)

混合使用jQuery和Angular是一个坏主意。请改用AngularUI datepicker:https://github.com/angular-ui/ui-date

答案 1 :(得分:0)

$(iElem)将引用<date-picker> html元素,而不是模板中的实际input元素。所以要么选择<date-picker>元素内的输入,要么在指令定义中使用replace:true

$('input',$(iElem)).datepicker(..)

OR

scope: {
                date: '=',
                placeHolder: '@',
                isRequired: '=',
                replace:true,
                name: '@'
            },

继承人工作fork