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

Question

我创建了两个指令用于输入字段 start_at 和 end_at，以显示 JQuery 日期选择器

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的maxDate将为campaign.end_at

我尝试过使用 AngularJS UI Datepicker，效果很好，但是我需要一个选项来在选择器中显示 2 个月，这让我改用 JQuery Datepicker。

Answer 1

对于遇到同样问题的人；我使用$watch 来更新我的日期选择器的最小值和最大值；这是工作的 plunker http://plnkr.co/edit/s71WDURou0QlRzM8Kjkc?p=preview