AngularUI Datepickerに無効な日付を入力することができます

Question

AngularUI Bootstrap Datepickerに最小日付と最大日付がある問題があります。ポップアップを開くと、無効な日付をクリックすることはできません。ただし、範囲外の日付を入力することはできます。入力された日付が以下の場合は最小の日付に、それ以降の場合は最大の日付に変換します。ここで

はplunkerです：コントローラでhttp://plnkr.co/edit/6U4YdTIyFXjOqRJm2qTq?p=preview

：

テンプレートで

$scope.dateOptions = { 
    maxDate: $scope.maxDate, 
    minDate: $scope.minDate, 
}; 

：datepicker-options="dateOptions"

私がいるので、必要な場合を除きjQueryのまたは日付ライブラリを使用しないようしたいのですがこれは私がこの機能を必要とする唯一のフィールドです。

私はこの問題のいくつかの報告を見つけましたが、「修正済み」とマークされているので、何か不足している可能性があります。

https://github.com/angular-ui/bootstrap/pull/3020

https://github.com/angular-ui/bootstrap/pull/2901

同様のstackflow質問

AngularUI datepicker allows typing value outside of range実際の作業plunkerを持っていますが、それはangularui日付ピッカーではなく、受け入れられた答えはプラグインで、私がしたい示唆避ける。私はui-date="dateOptions"をプランナーと同じテンプレートで使用しようとしましたが、何も変わりませんでした。

私はそうのようなディレクティブのいくつかの並べ替えを考えています：

angular.module('ui.bootstrap.demo').directive('isValidDate', function() { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function(scope, elem, attrs, ctrl) { 

     //first, assume it's a valid date until check 
     ctrl.$setValidity('isValidDate', true); 

     if(scope.dt > attrs.maxDate || scope.dt < attrs.minDate) { 
      ctrl.$setValidity('isValidDate', false); 
     } 
    } 
}; 
}); 

とテンプレートにis-valid-dateを追加します。 ; }）PlukrのURL here

angular.module('ui.bootstrap.demo').directive('isValidDate', function() { 
return { 
    restrict: 'A', 
    require: 'ngModel', 
    link: function(scope, elem, attrs, ctrl) { 
    scope.invalidDateChoosen= false; 
    elem.bind("change", function(){ 
    ctrl.$setValidity('isValidDate', true); 
     if(scope.dt > scope.mymaxmonth || scope.dt < scope.mymindate) { 
     scope.dt=''; 
     scope.invalidDateChoosen=true; 
     ctrl.$setValidity('isValidDate', false); 
     scope.$apply(); 
     } 
    }); 
} 

};：しかし、これは私があなたのために働いディレクティブをした

Answer 1

:(機能していない、私はこのソリューションはあなたのために働く知っています