Question

我为我输入两个指令输入字段start_at和end_at，以显示JQuery datepicker

PLUNKR：http://plnkr.co/edit/s71WDURou0QlRzM8Kjkc?p=preview

JS：

app.directive("startDateCalendar", [
  function() {
    return function(scope, element, attrs) {
      return element.datepicker({
        dateFormat: "yy-mm-dd",
        numberOfMonths: 2,
        defaultDate: scope.campaign.start_at,
        beforeShowDay: $.datepicker.noWeekends,
        onSelect: function(date) {
          scope.campaign.start_at = date;
          scope.$apply();
        }
      });
    };
  }
]).directive("endDateCalendar", [
  function() {
    return function(scope, element, attrs) {
      return element.datepicker({
        dateFormat: "yy-mm-dd",
        numberOfMonths: 2,
        minDate: scope.campaign.start_at,
        defaultDate: scope.campaign.end_at,
        beforeShowDay: $.datepicker.noWeekends,
        onSelect: function(date) {
          scope.campaign.end_at = date;
          return scope.$apply();
        }
      });
    };
  }
]);

HTML：

<input type="text" start-date-calendar ng-model="campaign.start_at" />
<input type="text" end-date-calendar ng-model="campaign.end_at" />

我想要发生什么：

当用户更新campaign.start_at时，campaign.end_at的minDate将为campaign.start_at
当用户更新campaign.end_at时，campaign.start_at的最大日期为campaign.end_at

我尝试过使用AngularJS UI Datepicker，但是我需要一个选项，在选择器中显示2个月，这使我转而使用JQuery Datepicker。

Answer 1

遇到同样问题的人;我使用$watch来更新我的datepicker的min和max;这是工作的plunker http://plnkr.co/edit/s71WDURou0QlRzM8Kjkc?p=preview

更新AngularJS Directive中两个JQuery datepicker的minDate和maxDate

1 个答案: