为啥 datepicker 值没有改变？

Posted 2023-02-23

【中文标题】为啥 datepicker 值没有改变？

【英文标题】：why the datepicker value not changing?为什么 datepicker 值没有改变？

【发布时间】：2017-06-23 06:16:36

【问题描述】：

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

html:

<div class="form-group">
        <label>Model Production Date</label>
        <input date-picker1 type="text" class="form-control" placeholder="Production Date" ng-model="productionDate">
      </div>
      <div class="form-group">
        <label>Next Review Date</label>
        <input date-picker2 type="text" class="form-control" placeholder="Next Review Date" ng-model="nextReviewDate">
      </div>

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 值发生变化，但第二个日期选择器开始日期和结束日期没有更新。我被困了2天。请帮忙

【问题讨论】：

还是不能解决问题。任何身体都可以帮忙吗？

【参考方案1】：

当您将值传递给指令时，将创建一个隔离范围。您可以使用指令的范围属性来定义如何处理传递给该指令的值。

.directive('datePicker2', function () 

    return 
        scope: 
            name: "=",
        ,
        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]);
            element.datepicker(
                format: "yyyy/mm/dd",
                todayHighlight: true,
                startDate: stDate || new Date(),
                endDate:enDate || new Date(),
                autoclose: true
            );
            if(newVal)
                scope['nextReviewDate'] = newVal;
            
            else
                scope['nextReviewDate'] = setDate();
            
        );
    ;

【讨论】：

在对第一个字段进行任何更改后，我可以使用点运算符访问第二个 directives 中的值。但只有更改没有反映在日期选择器中。

问题已解决。实际上，我为此目的使用的引导日期选择器并不令人耳目一新。请在这里找到答案***.com/questions/42091426/…