Javascript 无法在另一个日期选择器中更改日期选择器参数?

Javascript 无法在另一个日期选择器中更改日期选择器参数?,javascript,jquery,angularjs,angularjs-directive,bootstrap-datepicker,Javascript,Jquery,Angularjs,Angularjs Directive,Bootstrap Datepicker,我在一张表格里有两个日期选择器。当用户选择第一个日期时,应更新第二个日期选择器的最小和最大日期(自选择日期起一年)。但在我的例子中,当我第一次在第一个日期选择器中选择日期时,最小和最大日期只更新一次。但是,如果我更改选择,则第二个日期选择器不会使用更改的值进行修改 html: 每次我都可以看到stDate和enDate值更改,但第二个日期选择器的开始日期和结束日期没有更新。我被困了两天。请帮助需要进行几项更改 angular.module("myApp", []); angular

我在一张表格里有两个日期选择器。当用户选择第一个日期时,应更新第二个日期选择器的最小和最大日期(自选择日期起一年)。但在我的例子中,当我第一次在第一个日期选择器中选择日期时,最小和最大日期只更新一次。但是,如果我更改选择,则第二个日期选择器不会使用更改的值进行修改

html:


每次我都可以看到
stDate
enDate
值更改,但第二个日期选择器的开始日期和结束日期没有更新。我被困了两天。请帮助

需要进行几项更改

 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');
          }
        });
      };
    });
它正在工作。看看



我将用代码解释更新我的答案

嗨,你用哪个脚本来呈现日期选择器?你介意提供一个提琴吗?将你的
$element.datepicker…
包装在
$scope.$evalAsync(function(){//date picker})中@GangadharJannu我已经试过了,但是仍然没有更新。@sankycse你能提供一个修改你的代码的工具吗,这会有很大的帮助。哇!!!这真是太棒了。请提供一些解释,我是新手。非常感谢。
.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 
        }); 

    });         
};

})
 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');
          }
        });
      };
    });