CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
dsdeiz
dsdeiz

Reputation: 137

ng-repeat of a directive and $validators

So I have this plnkr. I'm trying to figure out how to allow the user to be able to submit the form despite having an empty "item group" i.e. user is able to submit despite having both item.foo and item.bar empty but not when one of the form controls isn't empty.

Upvotes: 0

Views: 30

Answers (1)

alsafoo
alsafoo

Reputation: 788

change your template to be:

    angular.module('plunker', []).controller('MainCtrl', function($scope) {
    $scope.myModel = {};
    $scope.myModel.items = [];
    $scope.myModel.items.push({ foo: 'foo', bar: 'bar' });
  }).directive('myDirective', function() {
    return {
      require: 'ngModel',
      scope: {
        myModel: '=ngModel',
      },
      link: function(scope, elem, attrs, modelCtrl) {

      },
      template: '<ng-form name="add">' + 
        '<input type="text" name="foo" ng-required="myModel.bar" ng-model="myModel.foo" />' +
        '<input type="text" name="bar" ng-required="myModel.foo" ng-model="myModel.bar" />' +
        '</ng-form>',
    }
  })

notice the ng-required attribute.

This basically says make foo required when bar is evaluated to true. And make bar required only when foo is evaluated to true

See it live here: http://plnkr.co/edit/pCq8MfgLkZALaWcRLLNz?p=preview

Upvotes: 2

Related Questions