2

I have always used ng-required with conditionals undefined like that:

<input type="text" name="var" id="var" ng-model="variable" ng-disabled="variable === undefined" ng-required="variable !== undefined">

I've never had any problems with this until now. I tried with different angularJS versions from version 1.4.9 to 1.6.2 and it happens to me the same, it enters a loop in browser because it changes the value of "variable" between the value that I have given it and undefined and it finishes failing the browser. I do not understand, I do not know why it fails now.

This is the error

Paula Fernández Rubio
  • 23
  • 3
  • Would you mind to add a demo? – Gangadhar Jannu Feb 14 '17 at 11:11
  • why there is `!==` in `ng-required` shouldn't it be `!=` ? – Curiousdev Feb 14 '17 at 11:15
  • That is true, if I use undefined the field is disabled, I had not noticed that in this case became the undefined variable. Then I will use the condition null. I need to know from back which fields are enabled and required, and I needed a way to differentiate them and I had thought of the undefined, but I see that it is not viable. – Paula Fernández Rubio Feb 14 '17 at 12:06
  • What is the point of setting the `disabled` attribute whenever the variable `variable` is `undefined`? This would mean that your input field will be disabled as soon as the user empties the input field. When you remove the `ng-disabled` directive it should work fine. – The_Dude Feb 14 '17 at 12:07
  • Although remove ngDisabled the problem persists, I already tried that – Paula Fernández Rubio Feb 14 '17 at 12:09
  • Then why do you even want to set the `required` attribute depending on the value of your input field? I would rather use another variable to determine whether your input should be required or not or something like a checkbox, to toggle between `required` and `not required`. – The_Dude Feb 14 '17 at 12:39
  • Okay, that field does depend on another, in fact on what is selected in a select. As soon as the form appears the fields have to be disabled and not required and when a select option is selected, certain fields of the form are enabled and required. What I had thought was that back I would return the fields that are unlocked and are required in the response when selecting a select option, as these options may change to the client's liking. – Paula Fernández Rubio Feb 14 '17 at 12:54
  • You're right, better to use another variable, which I try is too complicated – Paula Fernández Rubio Feb 14 '17 at 13:14

1 Answers1

2

Using the same scope variable to determine ng-required (which again targets itself) is not a good idea. So instead use different scope variable to conditionally mark input required or disabled like:

<input type="text" name="var" id="var" ng-model="variable" ng-disabled="otherVariable === undefined" ng-required="otherVariable !== undefined">

To clearly explain why your code causes indefinite digest loop takes some digging into angularjs framework code, which is waste of time

Vohidjon Karimjonov
  • 539
  • 5
  • 9
  • Yes, if you use another variable there is no problem, but why does that happen using the same variable and undefined? If I use any other comparison it does not loop. – Paula Fernández Rubio Feb 14 '17 at 12:24