How to apply a directive into dynamic input? about angular-dynamic-forms HOT 6 OPEN

What does the console show? This looks like it should work...

from angular-dynamic-forms.

I was very sure this line made the necessary to compile the input: $compile(newElement)($scope)

The input rendered is: < input type="text" name="text" ng-model="stdFormData['text']" ng-required="true" placeholder="text" own-validator="something" required="required" >

Te console output when I try to write something into the input:

TypeError: Cannot set property 'text' of undefined
at D.assign (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:73:448)
at td.$setViewValue (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:140:392)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:113:26
at Object.$get.e.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:89:39)
at Object.$get.e.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:89:146)
at HTMLInputElement.h (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:113:6)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:24:155
at Array.forEach (native)
at m (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:6:192)
at HTMLInputElement.c (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js:24:126)

from angular-dynamic-forms.

That looks like you don't have a text key in your form's model...

from angular-dynamic-forms.

What do you mean? the ng-model is dynamically generated... so when I write the first time, the ng-model has not yet setting the key? and this is why the directive brokes? How can I solve it?

from angular-dynamic-forms.

It's entirely unrelated to your directive. When your form is built, the ng-model of the <dynamic-form> tag is used to define an object model, which then contains the various form elements' models as keys - submodels, if you will. In this case, that means $scope.stdFormData needs to have a text property defined in your controller: $scope.stdFormData.text = null; That should fix the error you're seeing at the moment.

As to your directive, if you're looking to get updates when the input value changes, you'll need to set up a watcher on the model. There might be a better hook you could use, depending on what you're aiming to do; check the Angular docs, or do a web search for validation directives, for more info on what to do with your directive here.

from angular-dynamic-forms.

@shuffledex - Have you figured this one out? I was mistaken a few comments prior to this one: it's not that you didn't have a text key on your form model, but rather that you hadn't defined your form model within the form's $scope. You'll need to be sure you include $scope.stdFormData = {}; in your controller - setting $scope.stdFormData.text would require you to do that first anyway, but isn't necessary in itself.

from angular-dynamic-forms.