it-swarm.com.de

Löst die Validierung eines Felds aus, wenn ein anderes Feld geändert wird

Ich habe eine benutzerdefinierte Validierungsanweisung, die korrekt aufgerufen wird, wenn ein Feld geändert wird. Ob dieses Feld gültig ist, hängt jedoch auch vom Wert eines anderen Felds ab. Dieses zweite Feld ist eine Auswahlliste, wenn dies von Bedeutung ist. 

Ich habe mich gefragt, ob es eine Möglichkeit gibt, die Validierung manuell auszulösen, wenn das zweite Formular geändert wird. Vielleicht mit dem ng-change-Ereignis. Was ist der richtige Weg, um mit so etwas umzugehen?

Hier ist meine Anweisung:

angular.module('myApp', []).
    directive('validage', function () {
        return {
            require: 'ngModel',
            link: function (scope, elem, attr, ngModel) {

                function validate(value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                }

                //For DOM -> model validation
                ngModel.$parsers.unshift(function (value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                });

                //For model -> DOM validation
                ngModel.$formatters.unshift(function (value) {
                    var valid = true;
                    if ((GetDateDifference(new Date(value), new Date()) < 16 || GetDateDifference(new Date(value), new Date()) > 129)
                    && scope.dep.DependantType == "Spouse") {
                        valid = false;
                    }
                    ngModel.$setValidity('validage', valid);
                    return value;
                });
            }
        };
    });

Wenn Sie neu bei AngularJS sind, würde ich definitiv empfehlen, diese beiden Artikel zu lesen: Teil 1 & Teil 2 . Sie sind eine Übersicht über AngularJS-Formulare.

27
PFranchise

Nachdem ich viel danach gesucht hatte, habe ich festgestellt, dass wir die Validierung einfach durch Aufruf von $validate() im gewünschten Feld auslösen können.
Wenn beispielsweise Ihr Formular my_form heißt (dh das Markierungs-Tag im Markup ein name="my_form"-Attribut hat) und der Name des zu validierenden Feldes date ist (im Markup das Eingabefeld hat ein name="date"-Attribut), dann können Sie, wie von Ihnen vorgeschlagen, das ng-change-Ereignis des second -Felds verwenden und $scope.my_form.date.$validate(); aufrufen, wenn die Funktion ng-change aufgerufen wird.

48
gneri

Ich hatte ein ähnliches Problem: zwei Formularfelder "Intervall" (für $ scope.monitor.interval) und "Timeout" (für $ Scope.monitor.timeout) mit der Bedingung, dass das Timeout die Hälfte des Intervalls nicht überschreiten darf. 

Zuerst habe ich einen benutzerdefinierten Prüfer zum Timeout hinzugefügt, der auf diese Bedingung prüft. Jetzt musste ich den Timeout-Validator auch dann auslösen, wenn sich das Intervall ändert. Dies ist mir durch das Betrachten der monitor.interval-Eigenschaft des Modells gelungen:

function EditMonitorCtrl($scope, $log, dialog, monitor) {
    $scope.monitor = monitor;

    ...

    // trigger validation of timeout field when interval changes
    $scope.$watch("monitor.interval", function() {
        if ($scope.editMonitorDlg.timeout.$viewValue) {          
            $scope.editMonitorDlg.timeout.$setViewValue($scope.editMonitorDlg.timeout.$viewValue);
        }
    });
}

Ohne "wenn" wurde der Timeout-Wert während der Initialisierung des Dialogs entfernt. 

3
stephanme

Am Ende fügte ich dem zweiten Feld die Direktive hinzu und änderte dann die Direktive, um die Fehlermeldung zum Feld mit dem Fehler hinzuzufügen. Es könnte einen besseren Weg geben, aber das ist es, was ich am Ende getan habe.

0
PFranchise

Ich konnte ng-blur="myForm.myField.$validate()" nicht mit AngularJS 1.5 arbeiten, möglicherweise weil das Modell für myField leer war. 

ng-blur="myForm.myField.$setTouched()" hat jedoch funktioniert. 

0
isherwood