Sunday 15 April 2012

html - How to validate inputs dynamically created using ng-repeat, ng-show (angular) -


I have a table that has been created using NG-Rietpet I want to add verification for each element in the table. The problem is that the names of each input cell are the same as the upper and lower cells. I tried to use the {{$ index}} value to name the input, but in HTML despite the string literals, it is working now.

Here's my code as of now:

  & lt; Td> & Lt; Input ng-model = "r.QTY" class = "span1" name = "qty {{$ index}}" ng-pattern = "/ ^ [\ d] * \. [\ D] * $ /" required / & Gt; & Lt; Span class = "warning-error" ng-show = "form. Qty {{index $}}. $ Error.pattern" & gt; & Lt; Strong & gt; A number is required. & Lt; / Strong> & Lt; / Span & gt; & Lt; Span class = "alert-error" ng-show = "form.QTY {{$ index}}. $ Error.required" & gt; & Lt; Strong & gt; * Required & lt; / Strong> & Lt; / Span & gt; & Lt; / TD & gt;   

I have tried to remove `{{}} 'from the index, but it does not work either. So far, the valuation properties of the input are working correctly, but the error message is not displayed.

Anyone have any suggestions?

Edit: In addition to the great responses below, there is a blog article that covers this issue more broadly:

Angel JSE rely on input names to highlight verification names.

Unfortunately, as of today, to produce the name of an input dynamically (without using custom instructions) is not possible. In fact, by checking, we can see that the name attribute is only one String accepts.

To resolve the 'dynamic name' problem, you need to create an internal form (see) :

    

The second option would be to write a custom directive for this.

Here's showing the use of JSFold NGForm:

No comments:

Post a Comment