1

在Angular中,我試圖驗證模糊場的值。我有一個客戶名單,我想檢查該字段中的模型值是否在我的客戶名單中。如果不是,我想將有效性設置爲false。自定義驗證的角度形式 - 模糊

我知道ng-model-options="{updateOn: 'blur'}存在,但是我不能使用它,因爲這個字段是一個前面的類型,所以它必須根據模型進行更新。驗證是模糊處理需要發生的事情。

的答案似乎是:

  1. 寫它作爲控制器和使用$ setValidity的功能就像你在一個指令。使用ng-blur在輸入字段中觸發該功能。

    - 但是,我一直在運行自定義驗證的示例(如果模型值與列表中的某個不匹配,則使該字段無效)僅寫入指令。是否有作爲函數寫入的自定義驗證示例?

  2. 編寫一個只在模糊時觸發的指令。

但是,我找不到能夠完成這些任務的示例。任何人都有一個自定義驗證的例子作爲一個函數或一個只更新字段模糊的指令?

我發現這個環節非常有幫助的自定義驗證,但我仍然有一個功能和指令之間的差異同樣的問題:How to add custom validation to an AngularJS form?

回答

3

由於這是我們最近一直在努力:

<form name='vm.formName' id='vm.formName' novalidate> 
    <input type='text' id='textField' name='textField' ng-blur='vm.blurMethod()' ng-model='vm.model.text' /> 
    // The submit is only here for show; 
    <input type='submit' id='submit' ng-click='vm.submitForm()' /> 
</form> 

在控制器:

blurMethod() { 
    if (this.formName.textField.$viewValue !== myArbitraryValue) { 
    // $setValidity called on the form, setting the textfield's validity to false 
    // then you can have your own validators show the error in the template 
    this.formName.$setValidity('textField', false); 
    } 
} 

這是關我的頭頂,將在早上看看它是否反映了我們一直在使用的東西。立即更新$ setValidity調用。

這假設你使用的是controllerAs:'vm'語法,這就是爲什麼表單有一個名字'vm.formname'並且控制器正在使用'this'。

+0

這看起來很有希望,期待明天的更新 – jenryb

+0

嘿rrd,有沒有發現它是否與你一直使用的相匹配? – jenryb

+0

是的,我更新了這篇文章,這是我們正在使用的。在表單上調用$ setValidity()並將輸入字段作爲參數。 – rrd

1

我已經使用的用戶界面,引導用於預輸入用大量控制對您的驗證ui-bootstrap typeahead

編輯 - 代碼示例

<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control" typeahead-no-results="$scope.matchFail"> <div ng-show="$scope.matchFail">Not on list!!</div>

WHE n您選擇的值是不在名單上,在div顯示

+0

鍵入工作正常。你在談論什麼樣的驗證?如果沒有結果,我希望在那裏出現錯誤:「typeahead-no-results $(默認:angular.noop) - 綁定到指示是否找不到匹配結果的變量。」現在它顯示沒有結果,但它不會在我的表單中引發錯誤。 – jenryb

+0

這對我沒有幫助。我有沒有結果工作,它顯示div。這部分很簡單。不起作用的是驗證,例如,在此鏈接中顯示的內容:http://stackoverflow.com/questions/12581439/how-to-add-custom-validation-to-an-angularjs-form。在這種情況下,如果顯示typeahead-no-results,則不能提交表單。如果有幫助,下面的答案更接近我正在尋找的答案。 – jenryb