我在Angular 1.4.9中使用JqueryUI datepicker（1.0.0）指令來顯示出生日期。該字段不是必需的，除非填充，否則不應驗證。Angular UI datepicker在空時驗證爲false
頁面加載後，該字段被驗證爲真（如預期）。一旦用戶選擇一個日期，它再次有效。但是，如果我們要手動刪除該字段，則該字段將變爲無效。
<input ui-date="dateOptions" name="dateOfBirth" ng-model="dob"/>
ng-model可以設置爲前後相同的值，但是值保持無效。
我已經創建了一個JSFiddle來複制這裏的問題。 https://jsfiddle.net/nipuna777/ctsmuv80/
正如所說@ nipuna777，它看起來像在日期選擇器中的錯誤。
我們可以通過指令修復它。
jsfiddle上的示例。
var myApp = angular.module('myApp', ['ui.date']);
myApp.directive('uiDateFix', function($timeout) {
return {
restrict: "A",
require: 'ngModel',
priority: 100,
scope: {
ngRequired: "="
},
link: function(scope, elem, attr, ngModel) {
var originalValidate = null;
$timeout(function() {
if (!originalValidate)
originalValidate = ngModel.$validators.uiDateValidator;
ngModel.$validators.uiDateValidator = function uiDateValidator2(modelValue, viewValue) {
//Define correct validations
if (viewValue || scope.ngRequired)
return originalValidate(modelValue, viewValue);
else
return true;
}
}, 500);
}
}
});
//myApp.factory('myService', function() {});
myApp.controller('MyCtrl', function($scope) {
$scope.name = 'Superhero';
$scope.value = 'Superhero';
$scope.dateOptions = {
changeYear: true,
changeMonth: true,
yearRange: '1900:-0'
};
$scope.isReq = true;
$scope.dob = ""
})<script src="https://code.jquery.com/jquery-2.2.1.js" charset="utf-8"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.9/angular.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-date/1.0.0/date.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<body ng-app="myApp">
<div ng-controller="MyCtrl">
<h1> Datepicker</h1>
<form name="person">
<label for="dateOfBirth">Date of Birth: </label>
<input ui-date="dateOptions" name="dateOfBirth" ng-model="dob" ui-date-fix ng-required="isReq" />
<label for="isReq">Required </label>
<input type="checkbox" name="isReq" ng-model="isReq" />
<p>
dob value: {{dob}}
</p>
<p>
dob valid: {{person.dateOfBirth.$valid}}
</p>
<p>
dob errors: {{person.dateOfBirth.$error}}
</p>
<hr>
<h2>Recreating the problem</h2>
<ol>
<li>With the field empty dob is valid</li>
<li>When you select a value from datepicker again the dob field is valid</li>
<li>When dob is manually removed, the field becomes invalid</li>
</ol>
</form>
</div>
</body>爲什麼你需要一個解決方法，如果它已經在插件中修復了 –
我在回答固定版本的指令'ui-date'後添加了我的答案。當然，最好使用固定版本的指令'ui-date'。 –
它是在插件的驗證an issue，它is fixed在master branch/dist/date.js。
所以，你可以使用該文件，而不是一個在CDN解決它
https://jsfiddle.net/arunpjohny/j49k74v4/ –
看起來是在指令的錯誤，它不檢查該字段是否需要與否和驗證的價值 - '返回_angular2.default.isDate（uiDateConverter.stringToDate（ attrs.uiDateFormat，viewValue））;' –
@ArunPJohny有沒有辦法禁用此驗證或覆蓋它？ – nipuna777