1

2 つの日付を比較し、start_date が end_date より大きい場合にエラーを表示するカスタム検証 (ディレクティブ) を実行しています... ng-model を介して start_date を渡しています

ng-model="start_date"

および end_date と私のディレクティブ:

lower-than-date="{{end_date.toISOString()}}" //ignore the toISOString()

ディレクティブを使用している入力...

<input type="text" ng-model="start_date"
datepicker-popup="yyyy-MM-dd" min="today" show-weeks="false"
lower-than-date="{{end_date.toISOString()}}"/>

ディレクティブは...

.directive("lowerThanDate", ['$parse', function($parse) {
    return {
        require: 'ngModel',

        link: function (scope, element, attrs, ctrl) {

            var lowerThan = null;
            function revalidate(_val) {
                var valid = _val && lowerThan ? _val < lowerThan : true;
                ctrl.$setValidity('lowerThanDate', valid);
            }

            attrs.$observe('lowerThanDate', function(_value) {
                //Here I'm detecting when end_date change
                lowerThan = new Date(_value);
                revalidate(ctrl.$modelValue);
            });

            ctrl.$parsers.unshift(function(_value) {
                revalidate(_value);
                return _value;
            });
        }
    };
}])

このコードは正常に動作していますが、 end_date を変更した場合にのみ検証がトリガーされます。start_date も変更したときに検証したい。

問題は、どうすれば ng-model 値を「観察」して、start_date が変更されたときに検証をトリガーできるかということです。

注: これは、日付を比較するための一般的なディレクティブです。これを心に留めておいてください。

4

2 に答える 2