在另一个datepicker中更改时无法更改datepicker参数？

我在表单中有两个日期选择器。 当用户选择第一个日期时，应更新第二个日期选择器的最小和最大日期（距选择一年）。 但在我的情况下，当我第一次在第一个datepicker中选择日期时，最小和最大日期只更新一次。 但是，如果我更改选择，则第二个日期选择器不会使用更改的值进行修改。

HTML：

 Model Production Date  
 
 Next Review Date   

JS：

 .directive('datePicker1', function () { return function (scope, element, attrs) { element.datepicker({ format: "yyyy/mm/dd", todayHighlight: true, //startDate: stDate || new Date(), //endDate:enDate || new Date(), autoclose: true }); scope.$watch('productionDate', function (newVal, oldVal) { if(newVal){ scope['productionDate'] = newVal; } else{ return; } }); }; }) .directive('datePicker2', function () { return { restrict: 'A', link: linker, } function linker(scope, $element, attrs) { scope.$watch('productionDate', function (newVal, oldVal) { console.log('productionDate===='+scope.productionDate); splittedDateString = scope.productionDate.split('/'); stDate = new Date(splittedDateString[0], splittedDateString[1]-1, splittedDateString[2]); enDate = new Date(stDate.getFullYear()+1, splittedDateString[1]-1, splittedDateString[2]); console.log("Start Date = "+stDate); console.log("End Date = "+enDate); $element.datepicker({ format: "yyyy/mm/dd", todayHighlight: true, startDate: stDate || new Date(), endDate:enDate || new Date(), autoclose: true }); }); }; }) 

每次我都能看到stDate和enDate值发生了变化，但第二个datepicker开始日期和结束日期没有更新。 我被困了2天。 请帮忙

Answer 1

需要进行几项更改。

  angular.module("myApp", []); angular .module("myApp") .directive('datePicker1', function() { return function(scope, element, attrs) { element.datepicker({ format: "yyyy/mm/dd", todayHighlight: true, autoclose: true }); scope.$evalAsync(function() { scope['productionDate'] = element.val(); }); }; }) .directive('datePicker2', function() { return { restrict: 'A', link: linker, } function linker(scope, $element, attrs) { // yyyy/mm/dd 2017/02/07 var dateRegex = /^(\d{4})\/(\d{2})\/(\d{2})$/i, matchArr; var oneYearFromNow = null; $element.datepicker({ format: "yyyy/mm/dd", todayHighlight: true, autoclose: true }); scope.$watch('productionDate', function(newVal, oldVal) { if (newVal) { matchArr = newVal.match(dateRegex); // (parseInt(newVal.split("/")[0], 10) + 1) + newVal.slice(4); oneYearFromNow = (parseInt(matchArr[1], 10) + 1) + newVal.slice(4); $element.datepicker('setStartDate', newVal); $element.datepicker('setEndDate', oneYearFromNow); $element.datepicker('update'); } }); }; }); 

这是工作。 看看小提琴

---

我将用代码说明更新我的答案