Mike Feltman Mike Feltman - 1 year ago 127
AngularJS Question

ngMessages with Angular 1.5.x Component

I just tried introducing ngMessages into my app that's using Components that were added in 1.5. As soon as I include any reference to ngMessage in my template I'm receiving this error message:

Error: $compile:ctreq Missing Required Controller.

This is a common error with ngMessages and the normal remedy is
suggested here:

However, I'm using components, which are a special type of directive and this doesn't appear to be an option for components.

Has anyone gotten ngMessages to work within a component in 1.5?

The syntax for use with a directive is like this:

myApp.directive('myDirective', function() {
return {
require: 'ngModel',

The component documentation: https://docs.angularjs.org/guide/component doesn't cover an equivalent to

Answer Source

This might help you.

<form name="userLoginForm" autocomplete="off">
    <input type="text" minlength="10" maxlength="10" ng-pattern="/^[0-9]+$/" required ng-model="userData.mobileNumber" placeholder="Enter Mobile Number" class="form-control login-form-input" id="mobileNumber" name="mobileNumberInput"/> 
    <div ng-messages="userLoginForm.mobileNumberInput.$error" role="alert">
      <div ng-message="required">
          This field is required
      <div  ng-message="pattern">
        Enter correct mobile number
      <div ng-message="minlength, maxlength">
          Your mobile number must 10 characters long</div>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download