15

過去の日付を要求するためのカスタム バリデータを作成しました。フィールドに手動で日付を入力すると、検証がうまく機能するようです。ただし、プログラムで日付の変更を入力すると (フィールドに入力するのではなく、モデルを直接変更します)、検証は実行されません。

ドキュメントで指示されているように、カスタム検証ディレクティブを実行していると思います。 問題を示すjsFiddle を次に示します。フィドルで、[プログラムで日付を変更] ボタンをクリックすると、検証エラーが表示されないことがわかります (ただし、手動で変更すると表示されます)。これがディレクティブコードです(これもフィドルにあります):

myApp.directive('pastDate', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function (scope, element, attrs, ctrl) {
            ctrl.$parsers.unshift(function (viewValue) {
                var today = new Date();
                today = new Date(today.getFullYear(), today.getMonth(), today.getDate());

                if (new Date(viewValue) < today) {
                    ctrl.$setValidity('pastDate', true);
                    return viewValue;
                }
                ctrl.$setValidity('pastDate', false);
                return undefined;
            });
        }
    };
});
4

2 に答える 2

11

angular 1.3が$validatorsプロパティを提供するための新しい回答。

1.3 以降、妥当性を設定することは想定され$parsers$formattersいません。

その後、コードはより簡単になります:

myApp.directive('pastDate', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function (scope, element, attrs, ctrl) {
            ctrl.$validators.pastDate = function(modelValue) { // 'pastDate' is the name of your custom validator ...
                var today = new Date();
                today = new Date(today.getFullYear(), today.getMonth(), today.getDate());
                return (new Date(modelValue) < today);
            }
        }
    };
});

更新された jsFiddle : http://jsfiddle.net/jD929/53/

于 2014-10-28T14:58:53.537 に答える