AngularJS dynamic form field validation

I am trying to validate some form fields which are given to me from a backend endpoint...

So basically the input elements are dynamically created inside a ng-repeat. Therefore, the input attributes are also dynamically added, such as the type, name, etc...

However because the name attribute is dynamically added, when I try to validate it, like this, for example:


It doesn't return anything because at this point, it doesn't know what elName is.

I created a jsFiddle to demonstrate the problem:

Any help or advice will be much appreciated!


EDIT: I've been referring to this AWESOME documentation:


Try my custom directive:

  return {
          element.attr('name', scope.$eval(attrs.dynamicName));

Use it:

<input dynamic-name=""
       type="{{ field.type }}"
       placeholder="{{ }}"


Explanation of the problem:

By default, input elements using ngModelController (ng-model) call FormController.$addControl when they are linked to register itself and expose a property on the FormController with the name property of the input which is {{ }} in this case. Therefore, even though the control is registered but you don't have exposed properties on FormController with named email, firstName, you only have {{ }} referencing the last input item

Explanation of the solution:

In this solution, I created a custom directive to replace the {{ }} with the correct name at runtime.

For more information why I have to use terminal:true, and priority:1000, check out this discussion: Add directives from directive in AngularJS

Need Your Help

Mcrypt failing to work on new ubuntu setup

php ubuntu xampp mcrypt

i was previously building my website on windows with xampp etc... however due to some software issues i had to change to linux and am now running ubuntu 13.10.

Intelligent credit cards fields iOS

ios swift credit-card

i'm currently developing an app for iOS 8 in swift with a credit card payment functionality.