我該如何動態添加或刪除驗證

我目前正在嘗試使用Angularjs創建動態表單。爲了測試的目的，表單有3個字段通過ng-repeat指令動態添加。我該如何動態添加或刪除驗證

這裏是的jsfiddle：http://jsfiddle.net/charms/4E7zQ/3/

問：

我現在嘗試動態設置驗證指令。我想才達到以下幾點：

<input ng-model="item.value" name="{{item.name}}" type="{{item.type}}" placeholder="{{item.placeholder}}" {{item.validators}}/>

{{item.validators}}但是不起作用。有人知道我可以在動態字段創建過程中添加和刪除基本和自定義驗證器嗎？

我想不同的驗證器添加到動態添加表單字段，也拆除驗證，如果字段被刪除：

<input ng-model="user.email" name="email" type="email" placeholder="E-Mail" required email-available/> 
<input ng-model="user.firstName" name="firstName" type="email" placeholder="Firstname" required/> 
<input ng-model="user.lastName" name="lastName" type="email" placeholder="Lastname" required"/>

這可能與Angularjs？

例如，字段和驗證應該根據用戶點擊哪個單選按鈕而改變。我想通過刪除該字段並將其添加到動態添加的不同驗證指令來實現此目的。

正如您在JSFiddle中所看到的，點擊「添加」按鈕時，將會使用「required」指令創建3個字段。如果刪除了一個表單域（這是通過點擊刪除按鈕來實現的），那麼驗證也會被刪除。

現在我想添加另一個字段，其中包含不同的驗證指令，例如電子郵件可用，或者多個驗證指令，每個驗證指令對於創建的每個字段都是不同的。

如果有人有解決方案，這將是很好的。

來源

2013-05-16 Christopher Armstrong

檢查頁面上的自定義驗證http://docs.angularjs.org/guide/forms。所有的驗證發生在ngModel控制器中。有兩個陣列可容納消毒劑和驗證器 - $formatters和$parsers。我會做的是編寫一個指令，它將驗證器列表作爲參數，並將它們添加到上述列表中或從列表中刪除它們。

我看到的唯一問題是重新使用內置的驗證器。也許你可以從source中挑選驗證器函數並輸入你的指令。這不是很漂亮，但不難。

或者你可以自己寫驗證器。它們中的每一個都只是一個正則表達式。以下是我的團隊一直在做的事情：

.value('validators', (function() { 
    function validatorFromRegex(regex) { 
     return function (value) { 
      return (!value) ? true : (value.toString().match(regex) !== null); 
     }; 
    } 
    return { 
     required: function (value) { return (value !== ''); }, 
     path: validatorFromRegex(/^\/?([0-9A-Za-z]+[\-\/]?)*[0-9A-Za-z]+$/), 
     tag: validatorFromRegex(/^([0-9A-Za-z]+\-?)*[0-9A-Za-z]+$/), 
     date: validatorFromRegex(/^(0[1-9]|1[012])\/(0[1-9]|[12][0-9]|3[01])\/(19|20)\d\d$/), 
     spotify: validatorFromRegex(/^spotify:user:fusetv:playlist:[a-zA-Z0-9]{22}$/), 
     url: validatorFromRegex(/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/), 
     twitter: validatorFromRegex(/^[A-Za-z0-9_]{1,15}$/), 
     number: validatorFromRegex(/^\d+$/), 
     phone: validatorFromRegex(/^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/), 
     zipcode: validatorFromRegex(/^\d{5}(-\d{4})?$/) 
    }; 
})())

來源

2013-05-16 22:07:04

嗨伊萬，感謝您的回覆。代碼被剪掉了，你發佈了一個指令的一部分嗎？我會看看$ formatters和$ parsers。我認爲Angularjs可能支持一些開箱即用的東西。但你是對的。這似乎並非如此，您的解決方案看起來不錯。 –

好吧，它只是一個包含一堆驗證器的靜態對象，但可以用在指令中。 –

我該如何動態添加或刪除驗證

回答

相關問題