Controller 'ng-model', required by directive 'ngModel', can't be found! in custom validation directive

Question

I am writing a page which shows a input form which is dynamically created by the data from the database.

I am building the dynamic html & rendering it into the main page using a custom directive called "dynamic-render". It is successfully rendered.

I also have validation for the input fields in the dynamically created form. The default validations like required are working fine.

I also have custom validation directives in the dynamic form. But it is not working.

I am getting "Controller 'ng-model', required by directive 'ngModel', can't be found!" error.

I have googled & tried the solutions but none helped me.

I have created a demo in plunk. Plunk Demo

Please help me to resolve this issue. Thanks

Answer 1

You should write it with a camelCase:

require: "ngModel"

---

From directive docs:

Angular normalizes an element's tag and attribute name to determine which elements match which directives. We typically refer to directives by their case-sensitive camelCase normalized name (e.g. ngModel). However, since HTML is case-insensitive, we refer to directives in the DOM by lower-case forms, typically using dash-delimited attributes on DOM elements (e.g. ng-model).

The normalization process is as follows:

• Strip x- and data- from the front of the element/attributes.
• Convert the :, -, or _-delimited name to camelCase.