0

私は、eonasdan-datetimepickerの角ラッパーであるangular-eonasdan-datetimepickerを使用しています。終了日を常に開始日より長く保つ方法。また、終了日カレンダーの開始日までの前の日付を無効にします。angle-eonasdan-datetimepickerでリンクされたピッカーを使用するには?

私はUIを更新するために変更イベントを試みましたが、それは起こっていません。イベントは呼び出されていますが、値は更新されません。終了日ののonchangeイベントインサイド

$ scope.FormName.enddate = $ scope.startdate。

すなわち

(FormName.elementName)はモデルから開始日のユーザが選択した値を=。

それは使用していますjqueryので:

<script type="text/javascript"> 
    $(function() { 
     $('#datetimepicker6').datetimepicker(); 
     $('#datetimepicker7').datetimepicker({ 
      useCurrent: false //Important! See issue #1075 
     }); 
     $("#datetimepicker6").on("dp.change", function (e) { 
      $('#datetimepicker7').data("DateTimePicker").minDate(e.date); 
     }); 
     $("#datetimepicker7").on("dp.change", function (e) { 
      $('#datetimepicker6').data("DateTimePicker").maxDate(e.date); 
     }); 
    }); 
</script> 

角度ラッパーコードは次のようになります。

(function() { 
    'use strict'; 

    var module = angular.module('ae-datetimepicker', []); 

    module.directive('datetimepicker', [ 
     '$timeout', 
     function($timeout) { 
     return { 
      require: '?ngModel', 
      restrict: 'EA', 
      scope: { 
      options: '@', 
      onChange: '&', 
      onClick: '&' 
      }, 
      link: function($scope, $element, $attrs, controller) { 
      $element.on('dp.change', function() { 
       $timeout(function() { 
       var dtp = $element.data('DateTimePicker'); 
       controller.$setViewValue(dtp.date()); 
       $scope.onChange(); 
       }); 
      }); 

      $element.on('click', function() { 
       $scope.onClick(); 
      }); 

      controller.$render = function() { 
       if (!!controller) { 
       if (controller.$viewValue === undefined) { 
        controller.$viewValue = null; 
       } 
       else if (!(controller.$viewValue instanceof moment)) { 
        controller.$viewValue = moment(controller.$viewValue); 
       } 
       $element.data('DateTimePicker').date(controller.$viewValue); 
       } 
      }; 


      $element.datetimepicker($scope.$eval($attrs.options)); 
      } 
     }; 
     } 
    ]); 
})(); 

どれリードは非常に参考になります。

+0

ラッパーの新しいバージョンを確認してください。 – Atais

答えて

0

私はLIBのソースを渡す必要はありません推測:https://github.com/atais/angular-eonasdan-datetimepicker

あなたが要求したものをアーカイブすることも可能/簡単ですので、私はlibにを更新しました。

基本的に、今options代わりにJSON文字列、FEの目的である:

vm.options = { 
    format: "DD.MM.YYYY", 
    maxDate: dateTo 
}; 

及び変更が見て、適用されています。 デモのプラカードはここにあります:http://plnkr.co/ZSjN8f

関連する問題