當另一個字段被更改時觸發字段驗證

我有一個自定義驗證指令，當一個字段被更改時正在被正確調用。但是，該字段是否有效也是基於另一個字段的值。如果重要的話，這第二個字段是一個選擇列表。當另一個字段被更改時觸發字段驗證

我想知道是否有某種方式可以手動觸發驗證當第二個窗體被更改。也許通過使用ng-change事件。處理這樣的事情的正確方法是什麼？

這裏是我的指令：

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; 
       }); 
      } 
     }; 
    });

如果你是新來AngularJS，我肯定會推薦閱讀這些文章2：part 1 & part 2。它們是AngularJS表單的概述。

來源

2013-06-18 PFranchise

請參閱StackOverflow上的[this answer]（http://stackoverflow.com/a/16886177/2057033）。 – Blackhole

與角1.3這工作在指令：ngModel。$ validate（）; –

在anglular 1.2中，您可以使用ngModel $ setViewValue（）手動觸發$ parser中的所有函數。因此，只需將其設置爲：ngModel。$ setViewValue（ngModel。$ viewValue） – likesalmon

我最終將指令添加到第二個字段，然後更改指令以將錯誤消息添加到帶有錯誤的字段。可能有更好的辦法，但那是我最終做的。

來源

2013-06-18 18:08:38 PFranchise

我有一個類似的問題：兩個表單字段「間隔」（對於$ scope.monitor.interval）和「超時」（對於$ scope.monitor.timeout），條件是超時不得超過間隔的一半。

首先，我添加了一個自定義驗證器來檢查這種情況的超時。現在我需要在間隔更改時也觸發超時驗證程序。如果沒有「如果」超時值時得到的對話框中去掉intialisation

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); 
     } 
    }); 
}

：我通過觀察模型的monitor.interval屬性實現這一點。

來源

2013-07-20 16:23:31 stephanme

經過多次搜索後，我發現只需在所需的字段上調用$validate()即可觸發驗證。
因此，舉例來說，如果你的窗體名爲my_form（即在標記的形式標記有一個name="my_form"屬性），並要驗證的字段的名稱日期（在標記輸入字段有name="date"屬性），則根據您的建議，只要調用ng-change函數，就可以使用第二個字段的ng-change事件，並調用$scope.my_form.date.$validate();。

來源

2015-01-03 20:55:49 gneri

謝謝！這也可以在調用ngModel的指令中起作用。$ validate（）; ..例如，如果你有你觀察到的屬性，你可以重新驗證模型:) –

哪個版本的角度是可用的？我使用1.2.18，而我沒有看到$ validate（）函數。 –

我使用的是版本1.3.2。 '$ validate（）'從版本1.3.0開始可用。順便說一句，你可以在這裏看到關於ngmodel和字段名稱之間關係的更多信息：https：//code.angularjs.org/1.3。0/docs/guide/forms，在_Binding下形成和控制state_。 – gneri

我無法獲得ng-blur="myForm.myField.$validate()"在AngularJS 1.5中的工作，可能是因爲myField的模型爲空。

但是，ng-blur="myForm.myField.$setTouched()"確實工作。

來源

2017-06-06 14:32:28 isherwood

當另一個字段被更改時觸發字段驗證

回答

相關問題