CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
Maurice
Maurice

Reputation: 109

Using angular form in directive template

I am using require: '^form' in my simple directive.

Then I trying to use this form in an ng-show but it doesn't seem to work.

Note: I don't want to pass the form name in as an attribute.

Can anyone see where i am going wrong? I only want the message to show when the form is invalid.

angular.module('xxx').directive('errorWall', errorWall);

function errorWall() {
    return {
        restrict: 'E',
        require: '^form',
        scope: {},
        link: (scope, elm, attrs, frm) => {
            scope.formCtrl = frm;
        },
        template: '<div ng-show="formCtrl.$invalid">You have error messages.</div>'
    };
}

Upvotes: 0

Views: 80

Answers (1)

reneras
reneras

Reputation: 26

Make sure you've placed the directive inside the form with at least one input with a ng-model directive on it.

<form>
  <input type="text" ng-model="name" required />
  <error-wall></error-wall> 
</form>

Here's a working fiddle https://jsfiddle.net/3gv8nvL3/3/ with one form required input.

Upvotes: 1

Related Questions